您好,我需要这个来添加删除类并设置 nextAll 输入的值。
我可以让它工作,但它只能工作一次。我需要它更像一个 toogle。
$(document).ready(function () {
$(".fa-circle").click(function () {
$(this).nextAll('input').first().val('Yes');
$(this).removeClass("fa-circle light_gray").addClass("fa-check green");
});
$(".fa-check").click(function () {
$(this).nextAll('input').first().val('No');
$(this).removeClass("fa-check green").addClass("fa-circle light_gray");
});
});
.green {
color: #8FCE35;
}
.light_gray {
color: #DDDDDD;
}
.point {
cursor: pointer;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<table class="candi_elections_table" align="center" style="text-align: left;">
<tbody>
<tr>
<td>198</td>
<td>
<span class="fa-check font16 green point">CLICK HERE</span>
<input id="198" class="" type="text" data-tooltip="" data-load-state="" data-inputmask="" style="" title="" placeholder="" value="" name="198" vk_11844="subscribed">
</td>
<td>Something 1</td>
</tr>
<tr>
<td>200</td>
<td>
<span class="fa-circle font16 light_gray point">CLICK HERE</span>
<input id="200" class="" type="text" data-tooltip="" data-load-state="" data-inputmask="" style="" title="" placeholder="" value="" name="200" vk_11844="subscribed">
</td>
<td>Something 2</td>
</tr>
<tr>
<td>201</td>
<td>
<span class="fa-check font16 green point">CLICK HERE</span>
<input id="201" class="" type="text" data-tooltip="" data-load-state="" data-inputmask="" style="" title="" placeholder="" value="" name="201" vk_11844="subscribed">
</td>
<td>Something 3</td>
</tr>
<tr>
<td>202</td>
<td>
<span class="fa-circle font16 light_gray point">CLICK HERE</span>
<input id="202" class="" type="text" data-tooltip="" data-load-state="" data-inputmask="" style="" title="" placeholder="" value="" name="202" vk_11844="subscribed">
</td>
<td>Something 4</td>
</tr>
</tbody>
</table>
谁能看出我做错了什么?
- fa-check 和 fa-circle 是很棒的字体
我也是在jsfiddle中得到的 https://jsfiddle.net/9bonuyyn/1/
最佳答案
你需要event delegation用于动态添加的类。你也可以像下面这样缩短你的 js
。
$('.candi_elections_table').on("click", ".fa-circle, .fa-check", function () {
if ($(this).hasClass('fa-circle')) {
$(this).nextAll('input').first().val('Yes');
} else {
$(this).nextAll('input').first().val('No');
}
$(this).toggleClass("fa-check green fa-circle light_gray");
});
关于javascript - jQuery - 添加删除类 - 设置输入值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37086870/