JavaScript/DOM - 幫助刪除我的內嵌JavaScript

-1

JavaScript新手我無法想出解決此問題的方法。JavaScript/DOM - 幫助刪除我的內嵌JavaScript

我希望每個「添加到購物車」按鈕來調用相同的功能「AddtoCart」。我已經實現了這一點，但是以內聯JavaScript爲代價 - 這是我想避免的。

onclick= "AddToCart(document.getElementById('toy_title1').innerHTML,document.getElementById('toy_quantity1').value,document.getElementById('toy_price1').innerHTML)

那麼我將如何實現，包括以此爲外部JavaScript文件的一部分，牢記我必須能夠將其應用到所有4個獨特的項目

來源

2012-05-05 Sean Zulu

我找不到任何問題，究竟是什麼？ –

而不是那長長的代碼行，我想我的所有4個按鈕只調用「AddtoCart（）;」沒有內嵌JavaScript。 –

哦，這就是我剛纔的想法。對不起，我沒有看到任何「問題」，因爲你的代碼工作得很好，畢竟JS/HTML並沒有拋到你最終用戶的臉上。 –

那麼你應該閱讀有關addEventListener（標準）和attachEvent（IE）

//assume element means the button 
//you can use getElementsByTagName, getElementsByClassName, querySelectorAll etc. 
//to fetch your elements 

//DRY, store the operation in a function so it's reusabe and not written twice 
function thisFunction(){ 
    AddToCart(document.getElementById('toy_title1').innerHTML, 
     document.getElementById('toy_quantity1').value, 
     document.getElementById('toy_price1').innerHTML) 
} 

if(element.addEventListener){      //check if the standard is supported 
    element.addEventListener('click',function(){ //use it to add the handler 
     thisFunction(); 
    }); 
} else { 
    element.attachEvent('onclick',function(){  //else, we use IE's version 
     thisFunction(); 
    }, false); 
}

來源

2012-05-05 00:16:41 Joseph

但是玩具的ID可以改變，所以他需要傳遞參數給函數來改變元素的ID，他怎麼能這樣做呢？ – PedroSena

@PedroSena的帖子沒有提及，而且，這是作業。閱讀作業標籤，以及在有什麼時候應該做什麼。 – Joseph

你可以改變你的函數的方式：

function AddToCart(toyId) { 
    var title = document.getElementById('toy_title'+toyId).innerHTML; 
    var quantity = document.getElementById('toy_quantity'+toyId).value; 
    var price = document.getElementById('toy_price')+toyId).innerHTML 
}

然後在每一個按鈕，你只是通過玩具的ID

只是要小心約如價格敏感的數據，留下JavaScript的（我假設你會在此之後將其發送到後端）是危險的，它可以很容易地操縱。

但是，如果你的意圖只是一個測試或類似的東西，那就OK。

編輯：打電話給你的這個功能，你會做這樣的事情：

onclick="AddToCart(1)"

其中1是你的玩具的ID，你應該把它取決於你的玩具變成2,3 ...。

來源

2012-05-05 00:19:20 PedroSena

+1爲你的速度，例子和簡單。我打算提出同樣的建議，但是在我開始之前就已經完成了答案：P。 –

我很欣賞你的答案，但是，作爲新手，我不清楚。 :( 這是一個學校項目，所以我不關心敏感數據：D –

究竟什麼是不明確的？該函數或如何調用它正在做什麼？ – PedroSena

JavaScript/DOM - 幫助刪除我的內嵌JavaScript

回答

相關問題