Question

我创建了一个包含RadioButtonList的用户控件。基于RadioButtonList选择，特定将是可见的或隐藏的。以下是我的HTML代码：

<tr>
                            <td align="left" valign="middle">
                            <font size="2" face="Verdana, Arial, Helvetica, sans-serif">
                            Are you the Financial Analyst/Manager responsible for this profit center?
                            </font>
                            </td>
                            <td align="left" valign="middle">
                            <asp:RadioButtonList ID="RadioButtonListYesNo" runat="server" RepeatDirection="Horizontal">
                            <asp:ListItem Value="1">Yes</asp:ListItem>
                            <asp:ListItem Value="2">No</asp:ListItem>
                            </asp:RadioButtonList>
                            </td>
                            </tr>

<tr>
                        <td>
                        <div id="divFAFMQues" style="visibility:hidden;">                                               
                        <font size="2" face="Verdana, Arial, Helvetica, sans-serif">
                        Who is the FM/FA of this profit center?
                        </font> 
                        </div>                      
                        </td>
                        <td>
                        <div id="divFAFM" style="visibility:hidden;">
                        <input name="FAFM" type="text" id="TextFAFM" maxlength="20"/> 
                         </div>
                        </td>
                        </tr>

以下是我的Jquery功能：

 <script src="~/Scripts/jquery-1.11.2.js" type="text/javascript">
        $(document).ready(function () {

            $("input[id$=RadioButtonListYesNo]").change(function () {
                alert("In Jquery");
                var res = $('input[type="radio"]:checked').val();

                if (res == '1') {
                    $("#divFAFMQues").css("visibility", "hidden");
                    $("#divFAFM").css("visibility", "hidden");
                }
                else {

                    $("#divFAFMQues").css("visibility", "visible");
                    $("#divFAFM").css("visibility", "visible");
                }
            });
        });
    </script>

Jquery函数根本没有被触发，我无法使警报执行。我在哪里错了？我是否需要在我的解决方案中添加更多jquery文件？

Answer 1

你需要分开包含jquery和你的js代码，就像这样

<script src="~/Scripts/jquery-1.11.2.js" type="text/javascript"></script>
<script type="text/javascript">
  $(document).ready(function () {

        $("input[id^=RadioButtonListYesNo]").change(function () {
            alert("In Jquery");
            var res = $('input[type="radio"]:checked').val();

            if (res == '1') {
                $("#divFAFMQues").css("visibility", "hidden");
                $("#divFAFM").css("visibility", "hidden");
            }
            else {

                $("#divFAFMQues").css("visibility", "visible");
                $("#divFAFM").css("visibility", "visible");
            }
        });
    });

</script>

使用2个单独的script标记，一个用于添加js脚本文件，另一个用于内联js代码。

现在，jquery说：

$('[id^=hello]')选择所有ID开头的元素你好。
$('[id$=hello]')选择ID结尾的所有元素你好。

使用您的代码asp.net生成2个类型为radio RadioButtonListYesNo_0和RadioButtonListYesNo_1的无线电输入。在您的代码中，您使用的选择器id$=RadioButtonListYesNo永远不会匹配任何输入，因此，您需要像我上面所写的那样更改id^=RadioButtonListYesNo。

在asp.net用户控件中没有触发Jquery函数

1 个答案: