当前位置 : 主页 > 网页制作 > JQuery >

内部文本值的jQuery选择器语法

来源:互联网 收集:自由互联 发布时间:2021-06-15
我正在尝试将click事件添加到由Telerik ASP.NET小部件生成的选项卡中.为了实验的目的,我已经将生成的 HTML片段提升到静态页面中: HTMLHEADTITLEsandpit/TITLESCRIPT TYPE="text/javascript" SRC="jquery-1.9
我正在尝试将click事件添加到由Telerik ASP.NET小部件生成的选项卡中.为了实验的目的,我已经将生成的 HTML片段提升到静态页面中:

<HTML>
<HEAD>
<TITLE>sandpit</TITLE>
<SCRIPT TYPE="text/javascript" SRC="jquery-1.9.1.js"></SCRIPT>
<SCRIPT>
$(document).ready(function(){
  var foo = $("span.rtsTxt");
  var bar = foo.filter("[innerText='More']")
  bar.on('click',function(){alert('click');});
  alert('ready');
});
</SCRIPT>
</HEAD>
<BODY>
  <ul>
    <li class="rtsLI">
      <a class="rtsLink rtsAfter">
        <span class="rtsOut">
          <span class="rtsIn">
            <span class="rtsTxt">Preferences</span>
          </span>
        </span>
      </a>
    </li>
    <li class="rtsLI">
      <a class="rtsLink rtsAfter">
        <span class="rtsOut">
          <span class="rtsIn">
            <span class="rtsTxt">More</span>
          </span>
        </span>
      </a>
    </li>
  </ul>
</BODY>
</HTML>

调试显示foo包含两个预期的项目.但是,我无法弄清楚选择第二个语法,其中innerText的值是“更多”.

问题是我如何在过滤器表达式中如图所示或直接在选择器字符串中表达innerText ==’More’?

试试 :contains selector:

var bar = foo.filter(":contains('More')")

这是jsfiddle demo显示它正常工作.

警告:虽然这适用于问题中的html,但是:contains选择器将匹配包含给定文本的任何元素,而不仅仅是文本等于给定文本的元素. (正如@RAS在下面的评论中指出的那样.)

网友评论