選擇單選按鈕時刪除 Div 屬性

Question

我對 JavaScript 很陌生，不太確定我在做什么。 我發現了一些有用的代碼，可以在從下拉列表中選擇某個值時刪除/插入 Div 的屬性。 我想修改此代碼，以便在選擇單選按鈕時更改屬性。

這是我目前擁有的代碼：

function pageLoad(sender, args) {
    if (args.get_isPartialLoad()) {
        var rangeType = $('#<%= DateRangeList.ClientID%>').val();
        if (rangeType == 6) {
            $('#DatePeriodRow').removeAttr("style");
        }
        else {
            $('#DatePeriodRow').attr("style", "display: none;");
        }
    }
}


$(document).ready(function () {
    $('#<%= DateRangeList.ClientID %>').live("change", function() {
        var rangeType = $('#<%= DateRangeList.ClientID %>').val();
        if (rangeType == 6) {
            $('#DatePeriodRow').removeAttr("style");
        }
        else {
            $('#DatePeriodRow').attr("style", "display: none;");
        }
    });
})

我一直在嘗試各種方法來重建此代碼以滿足我的需要，但到目前為止沒有運氣。 我也做了很多谷歌搜索無濟於事。 我經常收到“Propery/Value is null or undefined”消息，我不確定如何調試 Java 方面的事情。

任何和所有的幫助將不勝感激！

Answer 1

而不是使用$('#DatePeriodRow').removeAttr("style"); 使用$('#DatePeriodRow').css("display", "none"); 為了隱藏 div 和$('#DatePeriodRow').css("display", "block"); 顯示div

Answer 2

如果您想顯示隱藏和元素，Raki 的回答就可以。 你也可以這樣表達：

$('#DatePeriodRow').hide(); // Hide Div
$('#DatePeriodRow').show(); // Show Div

不過，首先要注意的是，如果您的屬性/值未定義或為空，則您的選擇器可能有問題。 即以下行：

$('#<%= DateRangeList.ClientID %>')

<%= ... %> 看起來像 ASP，如果它打算在該環境中運行，那么該代碼可能無法正確評估，從而為您提供了錯誤的 jQuery 選擇器。

還有一件事

檢查您使用的是哪個版本的 jQuery，不推薦使用.live() ，較新的版本使用.on

Answer 3

ASP 單選按鈕列表呈現為一個表格，其中包含類型為“radio”的 html 輸入。 所以你需要在選擇器中添加“輸入”。 下面的代碼在加載文檔時為每個單選按鈕分配處理程序，並檢查是否已經檢查了其中一個按鈕。 如果是 - 它會觸發“更改”事件以觸發處理程序。 希望能幫助到你。

$(document).ready(function ()
    {
        $('#<%=DateRangeList.ClientID%> input').bind("change",
            function ()
            {
                if ($(this).val() == "6") {
                    $("#DatePeriodRow").show();
                }
                else {
                    $("#DatePeriodRow").hide();
                }
            });

        var checkedButton = $('#<%=DateRangeList.ClientID%> input[checked]').first();
        if (checkedButton.val())
        {
            checkedButton.trigger("change");
        }
    });