Question

我的jQuery代码没有在页面加载时触发。然而，一旦页面加载，然后如果我切换单选按钮它工作。我对jQuery和ASP.Net相当新，因此我不知道我哪里出错了。我试过了onload=""，但我无法弄清楚如何调用默认的jQuery函数，该函数在该onload代码块中没有任何名称。

$(document).ready(function () {
    $('#<%=RadioButtonList1.ClientID %>').click(function () {
        var SelectedValue = $('#<%=RadioButtonList1.ClientID %> input[type=radio]:checked').val();
        if (SelectedValue == 1) {
            //If cash is selected then hide the Div
            $('#DropDownList1').css("display", "none");
            $('#MetaType').css("display", "none");
            $('#TextBox7').css("display", "none");
            $('#MetaSize').css("display", "none");
            //or you can simply use jQuery hide method to hide the Div as below:
            //$('#dvShowHide').hide();          
        }
        else {
            //If Cheque is selected then show the Div
            $('#DropDownList1').css("display", "block");
            $('#MetaType').css("display", "block");
            $('#TextBox7').css("display", "block");
            $('#MetaSize').css("display", "block");
            //or you can simply use jQuery show method to show the Div as below:
            //$('#dvShowHide').show();
            //Clear textboxes
            $('#<%=TextBox7.ClientID %>').val('');

            //Set focus in bank name textbox
            $('#<%=TextBox7.ClientID %>').focus();
        }
    });
});

<asp:RadioButtonList ID="RadioButtonList1" runat="server">
    <asp:ListItem Value="0">Yes</asp:ListItem>
    <asp:ListItem Selected="True" Value="1">No</asp:ListItem>
</asp:RadioButtonList>

Answer 1

要在加载页面时调用click处理程序，您可以trigger()该事件：

$('#<%=RadioButtonList1.ClientID %>').click(function () {
    // your code here...
}).click(); // < trigger the event on load

您也可以使用.trigger('click');

或者，您可以将逻辑分离出自己的功能，该功能在单击按钮和页面加载时调用：

$(document).ready(function () {
    $('#<%=RadioButtonList1.ClientID %>').click(checkState); // onclick
    checkState(); // onload
});

function checkState() {
    var SelectedValue = $('#<%=RadioButtonList1.ClientID %> input[type=radio]:checked').val();
    if (SelectedValue == 1) {
        //If cash is selected then hide the Div
        $('#DropDownList1').css("display", "none");
        $('#MetaType').css("display", "none");
        $('#TextBox7').css("display", "none");
        $('#MetaSize').css("display", "none");
        //or you can simply use jQuery hide method to hide the Div as below:
        //$('#dvShowHide').hide();          
    }
    else {
        //If Cheque is selected then show the Div
        $('#DropDownList1').css("display", "block");
        $('#MetaType').css("display", "block");
        $('#TextBox7').css("display", "block");
        $('#MetaSize').css("display", "block");
        //or you can simply use jQuery show method to show the Div as below:
        //$('#dvShowHide').show();
        //Clear textboxes
        $('#<%=TextBox7.ClientID %>').val('');

        //Set focus in bank name textbox
        $('#<%=TextBox7.ClientID %>').focus();
    }
}

Answer 2

要在页面加载时运行该逻辑，最好将其解压缩到函数中，然后调用函数，如：

$(function () {
    setValue();
    $('#<%=RadioButtonList1.ClientID %>').click(setValue);
});


function setValue()
{
    var SelectedValue = $('#<%=RadioButtonList1.ClientID %> input[type=radio]:checked').val();
    if (SelectedValue == 1) {
        //If cash is selected then hide the Div
        $('#DropDownList1').css("display", "none");
        $('#MetaType').css("display", "none");
        $('#TextBox7').css("display", "none");
        $('#MetaSize').css("display", "none");
        //or you can simply use jQuery hide method to hide the Div as below:
        //$('#dvShowHide').hide();          
    }
    else {
        //If Cheque is selected then show the Div
        $('#DropDownList1').css("display", "block");
        $('#MetaType').css("display", "block");
        $('#TextBox7').css("display", "block");
        $('#MetaSize').css("display", "block");
        //or you can simply use jQuery show method to show the Div as below:
        //$('#dvShowHide').show();
        //Clear textboxes
        $('#<%=TextBox7.ClientID %>').val('');

        //Set focus in bank name textbox
        $('#<%=TextBox7.ClientID %>').focus();
    }
}

Jquery检查未在页面加载时触发

2 个答案: