[英]Combining two change functions
如何將.change
這兩種不同用法結合起來以實現一個功能?
兩者都使用$('input[name="menu"]')
但在語義上有所不同,因此我不確定將兩者結合的正確方法。
我試圖把$(".menu[data-id=" + this.id + "]").toggleClass("active", this.checked);
在.on("change"), function ()
沒有任何運氣。
$('input[name="menu"]') .change(function() { $(".menu[data-id=" + this.id + "]").toggleClass("active", this.checked); }) .change(); $(function() { $('input[name="menu"]').on("change", function() { if ( $(this) .closest('[class*="list-"]') .is(".list-custom") ) { if ($(this).is(":checked")) { $(this) .siblings("[data-icon]") .attr("data-prefix", "fas") .closest(".launch-icon") .addClass("checked"); } else { $(this) .siblings("[data-icon]") .attr("data-prefix", "far") .closest(".launch-icon") .removeClass("checked"); } } }); });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
如果是我,我將像這樣合並您的代碼,但是如果您正在尋找問題的真正解決方案,請提供html標記和有效的代碼段。
// Starting point.
$(document).ready(function()
{
// Register listener for the change event.
$('input[name="menu"]').change(function()
{
// This was on the first listener of change event.
$(".menu[data-id=" + this.id + "]").toggleClass("active", this.checked);
// This was on the second listener of change event.
if ($(this).closest('[class*="list-"]').is(".list-custom"))
{
if ($(this).is(":checked"))
{
$(this).siblings("[data-icon]").attr("data-prefix", "fas")
.closest(".launch-icon").addClass("checked");
}
else
{
$(this).siblings("[data-icon]").attr("data-prefix", "far")
.closest(".launch-icon").removeClass("checked");
}
}
});
// Trigger a change event on the input element.
// This was after the first event listener (why?)
$('input[name="menu"]').change();
});
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.