2012-11-19 14 views
0

http://jsfiddle.net/mGGPu/JavaScript的數學,列表,然後單擊功能

我所試圖做的是在選擇按鈕點擊時,項目名稱會進入購物車,以及該項目的價格。然後,當添加更多的項目時,JavaScript會完成所欠的整個「價格」數學。

也想在點擊按鈕後變爲禁用。

<div class="itemWrapper"> 
    <div id="item1" class="item"> 
     <span class="title">Item 1</span><br /> 
     <span class="image"><img src="http://www.thinkgeek.com/images/products/zoom/tqualizer_anim.gif" /></span><br /> 
     <div class="descrip"> 
     <span class="points">1000 pts</span><span class="sale">ON SALE</span><br /> 
     <span class="description">Here would be a simple description of the item for sale. 
     Then We will create a button below.</span> 
     </div> 
    </div> 
    <input type="submit" class="button2" value="Add To Cart" /> 
</div> 
<div class="cartWrapper" /> 
<div class="cart" id="cartj"> 
    <div class="cart_body"> 
     <div class="cart_title">Shopping Cart</div> 
     <div class="cart_items"> 
     <ul> 
      <li></li> 
     </ul> 
     </div> 
    </div> 
</div> 

有人可以幫我嗎?不知道這個代碼是最好用的

$('.button2').on('click', function() { 
    $(this).closest('.title').css("color","red"); 
}); 

這只是測試點擊按鈕,並更改標題顏色。這只是一個測試代碼,有點類似於後續查看點擊功能是否正常工作。雖然沒有。

也許這使物品進入購物車?

(function($){ 
$(function(){ $('.button2').click(function();var 
innerTxt=$(this).text();innerTxt=$.trim(innerTxt);var $obj= 
$('.cart_items li');$obj.val($obj.val()+innerTxt);})}); })(jQuery);​​​ 

雖然它不完整。我像沒有睡覺一樣奔跑,今天腦殘。

+0

你嘗試過什麼?我沒有看到任何嘗試做任何事的JavaScript。 – Shmiddty

+0

您不妨嘗試使用JavaScript構建房屋。建立一個有效的網上購物車有很多事情,你甚至都沒有想過。 – Blazemonger

+0

它不是一個真正的購物車。我們將這稱爲dummyCart。它不會處理任何數據或任何此類內容。它只是一個在線RPG購物車,用於支出積分。必須在網站上手動扣除積分。這只是人們看他們欠多少的粗略草圖。 – EasyBB

回答

0

你需要找到DIV中的跨度..

跨度title類不是按鈕的祖先。這是一個兄弟姐妹。所以你需要遍歷按鈕的父項,並找到你正在尋找的e title

$('.button2').on('click', function() { 

    $(this).closest('.itemWrapper').find('.title').css("color","red"); 
}); 

Check Fiddle

+0

謝謝,我這麼認爲。我試過最接近的div.itemWrapper span.title。我知道我在那裏跳了一步。儘管我不會改變標題的.css。實際上我將使用此代碼添加到購物車。 – EasyBB

相關問題