是否有跨浏览器的方式在 Expando 属性上使用 jQuery 选择器？

发布于 2024-09-17 10:00:45 字数 2843 浏览 4 评论 0原文

我有一个 ASP.NET 页面，我试图使用 jQuery 选择器快速匹配与特定文本框（文本输入）绑定的验证控件。验证控件呈现为跨度，“controltovalidate”属性呈现为 Expando 属性。下面是一个测试示例：

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>Untitled Page</title>
    <script type="text/javascript" src="jquery.js"></script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
        <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ControlToValidate="TextBox1"
            ErrorMessage="RequiredFieldValidator"></asp:RequiredFieldValidator>

        <asp:Button ID="Button1" runat="server" Text="Button" /></div>

        <input type="button" value="Test" onclick="ml_test();" />

        <script type="text/javascript">
            ml_test = function() {
                alert($('[controltovalidate=TextBox1]').get().length);
            };
        </script>

    </form>
</body>
</html>

呈现为：

(code removed here)

        <input name="TextBox1" type="text" id="TextBox1" />
        <span id="RequiredFieldValidator1" style="color:Red;visibility:hidden;">RequiredFieldValidator</span>
        <span id="RegularExpressionValidator1"></span>

        <input type="submit" name="Button1" value="Button" onclick="javascript:WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions(&quot;Button1&quot;, &quot;&quot;, true, &quot;&quot;, &quot;&quot;, false, false))" id="Button1" /></div>

        <input type="button" value="Test" onclick="ml_test();" />

        <script type="text/javascript">
            ml_test = function() {
                alert($('[controltovalidate=TextBox1]').get().length);
            };
        </script>

(code removed here)

<script type="text/javascript">
//<![CDATA[
var RequiredFieldValidator1 = document.all ? document.all["RequiredFieldValidator1"] : document.getElementById("RequiredFieldValidator1");
RequiredFieldValidator1.controltovalidate = "TextBox1";
RequiredFieldValidator1.errormessage = "RequiredFieldValidator";
RequiredFieldValidator1.evaluationfunction = "RequiredFieldValidatorEvaluateIsValid";
RequiredFieldValidator1.initialvalue = "";
//]]>
</script>

问题：ml_test() 函数在 Internet Explorer 7 中显示 1（如预期），但在 Firefox 3.6.8 中显示 0。我尝试添加额外的控件，但在 Firefox 中它始终不起作用。

我发现这篇文章显示在选择器中使用 & 符号，如 [@expando=value]，但是当我尝试此语法时，jQuery 1.4.2 会抛出错误。

是否有跨浏览器的方式来选择 Expando 属性，如果是，正确的语法是什么？

原文

I have an ASP.NET page and I am trying to quickly match the validation controls that are tied to a particular textbox (text input) using a jQuery selector. The validation controls render as a span and the "controltovalidate" property renders as an expando property. Here is a test example:

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>Untitled Page</title>
    <script type="text/javascript" src="jquery.js"></script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
        <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ControlToValidate="TextBox1"
            ErrorMessage="RequiredFieldValidator"></asp:RequiredFieldValidator>

        <asp:Button ID="Button1" runat="server" Text="Button" /></div>

        <input type="button" value="Test" onclick="ml_test();" />

        <script type="text/javascript">
            ml_test = function() {
                alert($('[controltovalidate=TextBox1]').get().length);
            };
        </script>

    </form>
</body>
</html>

Renders as:

(code removed here)

        <input name="TextBox1" type="text" id="TextBox1" />
        <span id="RequiredFieldValidator1" style="color:Red;visibility:hidden;">RequiredFieldValidator</span>
        <span id="RegularExpressionValidator1"></span>

        <input type="submit" name="Button1" value="Button" onclick="javascript:WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions("Button1", "", true, "", "", false, false))" id="Button1" /></div>

        <input type="button" value="Test" onclick="ml_test();" />

        <script type="text/javascript">
            ml_test = function() {
                alert($('[controltovalidate=TextBox1]').get().length);
            };
        </script>

(code removed here)

<script type="text/javascript">
//<![CDATA[
var RequiredFieldValidator1 = document.all ? document.all["RequiredFieldValidator1"] : document.getElementById("RequiredFieldValidator1");
RequiredFieldValidator1.controltovalidate = "TextBox1";
RequiredFieldValidator1.errormessage = "RequiredFieldValidator";
RequiredFieldValidator1.evaluationfunction = "RequiredFieldValidatorEvaluateIsValid";
RequiredFieldValidator1.initialvalue = "";
//]]>
</script>

The problem: the ml_test() function shows 1 in Internet Explorer 7 (as expected), but shows 0 in Firefox 3.6.8. I tried adding additional controls, but in Firefox it consistently doesn't work.

I discovered this post that shows the use of an ampersand in the selector like this [@expando=value], but when I try this syntax, jQuery 1.4.2 throws an error.

Is there a cross-browser way to select expando attributes, and if so, what is the proper syntax?

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

纵性 2024-09-24 10:00:45

您可以像这样使用 .filter() ：

ml_test = function() {
    alert($('span').filter(function() { return this.controltovalidate=='TextBox1'; }).length);
};

您可以在这里测试它，或者将其设为自定义选择器，如下所示：

jQuery.expr[':'].validatorFor = function(o, i, m){
  return o.controltovalidate === m[3];
};

并这样调用它：

ml_test = function() {
    alert($('span:validatorFor(TextBox1)').length);
};

您可以在此处找到该版本。

You can use .filter() like this:

ml_test = function() {
    alert($('span').filter(function() { return this.controltovalidate=='TextBox1'; }).length);
};

You can test it here, or make it a custom selector, like this:

jQuery.expr[':'].validatorFor = function(o, i, m){
  return o.controltovalidate === m[3];
};

And call it like this:

ml_test = function() {
    alert($('span:validatorFor(TextBox1)').length);
};

You can that that version here.

回复收藏 0 原文

晒暮凉 2024-09-24 10:00:45

您是否正在寻找显示无效验证消息的范围？

如果是这样，请尝试以下操作：（使用 jQuery）

ml_test = function() {
    alert($('RequiredFieldValidator1').length);
};

如果您还希望能够查看正在验证的控件，请执行以下操作：

ml_test = function() {

    // getting the control with jQuery by its ID.  .Net already has it
    // defined in the script block that is generated by the 
    // RequiredFieldValidator control
    var validateCtrl = $(RequiredFieldValidator1.id);  

    // get the value from the .Net-defined validator variable
    var controlToValidate = RequiredFieldValidator1.controltovalidate;

    // alert the values:
    alert('RequiredValidatorControl count: ' + validator.length + 
          '\nControl To Validate: ' + controlToValidate);

};

Are you looking for the span that shows the validation message if invalid?

If so try this: (using jQuery)

ml_test = function() {
    alert($('RequiredFieldValidator1').length);
};

If you want to also be able to see what control it's validating do something like this:

ml_test = function() {

    // getting the control with jQuery by its ID.  .Net already has it
    // defined in the script block that is generated by the 
    // RequiredFieldValidator control
    var validateCtrl = $(RequiredFieldValidator1.id);  

    // get the value from the .Net-defined validator variable
    var controlToValidate = RequiredFieldValidator1.controltovalidate;

    // alert the values:
    alert('RequiredValidatorControl count: ' + validator.length + 
          '\nControl To Validate: ' + controlToValidate);

};

回复收藏 0 原文

~没有更多了~