jquery顯示和隱藏div問題

我創建了一個可編輯的窗體，允許用戶編輯他們的個人資料信息。這個表格可以被保存和修改，所以我需要能夠隨着用戶的使用保存更新。這工作正常。jquery顯示和隱藏div問題

窗體非常長，所以在某些部分我有顯示/隱藏使用jQuery的字段取決於以前輸入的yes或no選擇。這也適用，但是如果在修改表單時選擇並保存了一個無線電輸入，則jquery再次隱藏了詳細信息字段。

所以我需要的是一些幫助修改以下jQuery代碼，以便如果既沒有單選按鈕被選中，詳細信息div被隱藏，但如果選擇了Yes選項並保存，它將在表單被修改時自動打開！基於感謝

$("#diet-details").hide(); 
$("input[name=diet]").click(function() { 
    if ($("#diet1").attr('checked')) 
     $("#diet-details").hide(); 

    if ($("#diet2").attr('checked')) 
     $("#diet-details").show(); 
});

來源

2013-01-10 user579984

可以儲存您的狀態會話或在localStorage的或提交與AJAX的形式（但如果你回到那個頁面也會重置表單，所以在任何情況下都要存儲你的輸入狀態。） –

'attr（'checked'）'返回_undefined_。 – undefined

僅供參考，因爲它「既沒有單選按鈕被選中，細節div被隱藏」 - 與您的代碼衝突＃diet1檢查隱藏該區域... –

您可以通過顯示/隱藏狀態的切換功能，而不是總是躲在開始飲食細節DIV，檢查是否diet1選項被選中，並顯示（或隱藏）上，

$(function() { 
    $('#diet-details').toggle($("#diet1").is(':checked')); 

    $("input[name=diet]").click(function() { 
    $('#diet-details').toggle($("#diet1").is(':checked')); 
    }); 
});

來源

2013-01-10 16:24:02

感謝這工作得很好，實際上簡化了我的代碼！ – user579984

@ user579984很高興我可以幫忙！ –

辦法做到這將是：

(function(){ 
    var $d1 = $("#diet1"), 
     $d2 = $("#diet2"), 
     $details = $("#diet-details"); 

    !$d2.prop('checked') && $details.hide(); 

    $("input[name=diet]").click(function() { 
     $d1.prop('checked') && $details.hide(); 
     $d2.prop('checked') && $details.show(); 
    }); 
})();

來源

2013-01-10 16:25:30 cacoroto

另一種方式來設置初始狀態：

function checkem() { 
    if ($("#diet1").prop('checked')) $("#diet-details").hide(); 
    if ($("#diet2").prop('checked')) $("#diet-details").show(); 
} 
$("input[name=diet]").click(function() { 
    checkem(); 
}); 
checkem(); //sets initial state based one current

測試小提琴：http://jsfiddle.net/YqUhZ/

如果你想讓它顯示如果沒有被選中，那麼：

function checkem() { 
    if ($("input[name=diet]:checked").length) { 
    $("#diet-details").hide(); 
    } else { 
    $("#diet-details").show(); 
    } 
} 
$("input[name=diet]").change(function() { 
    checkem(); 
}); 
checkem(); //sets initial state based one current

來源

2013-01-10 16:29:08

你也可能想要'.change'事件 –

jquery顯示和隱藏div問題

回答

相關問題