html+css+js 實現一個網頁小demo


js 從一個1.html跳轉到另一個2.html頁面並攜帶一定的數據

最近開始涉及js的學習,由於之前有一些html和css的基礎就開始制作一些靜態頁面利用js添加交互效果使得變得動態。在這里插入圖片描述
在這里插入圖片描述
我所做的就是從產品展示頁面添加某個產品的數量,點擊購物車圖標就可以跳轉到訂單頁面查看所加物品數量和總價格,商品價格也是有個動態交互(當鼠標移動到圖片上才可以顯示價格)具體實現思路我說一下:當鼠標點擊好加減按鈕想要添加到購物車時,點擊一下購物車圖標,就會彈出一個小窗口提示用戶是否確定加入購物車,點擊是進入訂單頁面,點擊否則取消加入購物車,跳轉到訂單頁面時可以點擊數量框查看該產品的價格,某些小伙伴不會與后台交互又想又數據的傳輸可以試下我的方法,但是最好學習如何從數據庫取數據。部分代碼我分享在下方(全部代碼我會上傳呦)
產品展示頁面點擊購物車代碼:
1.js:
function shopping_car1(){
var success =confirm(“確定加入購物車嗎?”);
if(success==true){
window.location.href =‘po.html?’+‘shopping_number=’+encodeURI(document.getElementById(“number_input1”).value);

  }
}

2.js
function shopping_count1(){
var loc = location.href;
var n1 = loc.length;//地址的總長度
var n2 = loc.indexOf("=");//取得=號的位置
var shopping_number = decodeURI(loc.substr(n2+1, n1-n2));//從=號后面的內容
document.getElementById(“count1”).value=shopping_number;
document.getElementById(“money1”).value=shopping_number*299;
}

大家有想問的可以在評論區留言呦~


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM