选择单选按钮时删除Div属性

时间:2016-05-05 10:25:23

标签: javascript jquery html css radio-button

我对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;");
        }
    });
})

我一直在尝试各种方法来重建这些代码以满足我的需求但到目前为止没有运气。我也做了很多谷歌搜索无济于事。我经常收到&#34; Propery / Value为null或undefined&#34;消息,我不确定如何调试java方面。

非常感谢任何和所有帮助!

3 个答案:

答案 0 :(得分:1)

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

答案 1 :(得分:1)

如果你想表现出隐藏和元素,Raki的回答就是这样。你也可以这样表达:

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

首先,如果您的Property / Value未定义或为null,您可能会遇到选择器问题。即以下一行:

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

&lt;%= ...%&gt;看起来像ASP,如果打算在那个环境中运行,也许代码没有正确评估,这会给你错误的jQuery选择器。

还有一件事

检查您正在使用的jQuery版本,.live()已弃用,较新版本使用.on

答案 2 :(得分:0)

ASP单选按钮列表呈现为一个表,其中包含类型为&#34; radio&#34;的html输入。所以你需要添加&#34;输入&#34;到选择器。下面的代码在加载文档时为每个单选按钮分配处理程序,并检查是否已经检查了其中一个按钮。如果是 - 它会触发&#34;改变&#34;触发处理程序的事件。希望它有所帮助。

$(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");
        }
    });