问题描述
我有一个HTML像这样的例子:
I have a html like this for example:
<li><label class="desc"><font color="green">Want to get email ($<span id="price">50</span>/month)</font></label>
<input type="checkbox" checked="" id="subscribe" name="subscribe"> bla bla bla</li>
<li><label class="desc">-$30 subscribe</label>
<input type="checkbox" id="custom_test" name="custom_test">Please check this to add your own email</li>
Stucture:
Stucture:
[复选框]订阅($ 50 /月)文字喇嘛喇嘛
[checkbox] subscribe (50$/month)text bla bla
[另一复选框]报价-30 $添加自己的电子邮件)
[another checkbox] offer -30$ to add own emails)
所以基本上我有一个复选框认购,用价格的认购,并根据该我还有一个复选框要约,如果你检查复选框应编辑内嵌的价格在上述认购有 - 30 $,如果检查,如果不保持不变。
So basically i have a check box to subscribe, with a price for that subscription, and under that i have another check box for "offer" if you check that check box it should edit inline the price in the above subscribe with -30$ if checked and and if not stay the same.
我怎么能做到这一点的,阿贾克斯或某种JQuery的/ JS功能在网上编辑根据跨度的与第二个复选框的ID的ID?
how can i do this with a Ajax or some kind of JQuery/JS function to edit in line depending on the ID of that span with id of the second checkbox ?
在此先感谢大家!
推荐答案
您知道,您有绝对可怕的非语义标记,不是吗?在此之前任何理智的,你需要使它有效和语义。但是,对于您目前的情况,这里是jQuery的片段:
You do know that you have absolutely awful non-semantic markup, don't you? Before doing anything sane, you need to make it valid and semantic. But for your current situation, here is the jQuery snippet:
var price = document.getElementById('price'),
origPrice = parseInt(price.innerHTML),
reducedPrice = parseInt(price.innerHTML) - 30;
$('#custom_test').change(function(ev) {
if (ev.target.checked) {
price.innerHTML = reducedPrice;
} else {
price.innerHTML = origPrice;
}
});
下面怎么可能要更新您的标记:
Here how you might want to update your markup:
<ul>
<li>
<label class="desc main">
Want to get email ($<span id="price">50</span>/month)
<input type="checkbox" checked="" id="subscribe" name="subscribe">
</label>
Some text
</li>
<li>
<label class="desc offer">
-$30 subscribe
<input type="checkbox" id="custom_test" name="custom_test">
</label>
Please check this to add your own email
</li>
</ul>
这篇关于内联复选框AJAX修改了一些的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!