0

我正在尝试搜索 .list 中的 p 标签内容,我可能只是过于复杂了,但我的警报不起作用,也许是因为我在页面上的其他代码不起作用,但我想知道是否有人可以帮助我弄清楚我哪里出错了。

JS

            $(document).ready(function() {
            var sresults = $('.mainsearch input').val();

            var sfinder = $('.list p').find(sresults).text(sresults);


            $('.mainsearch input').keyup(function () {
             $('.search-help').append(sfinder);

             alert(sfinder);

            });
            });

HTML

            <div class="mainsearch">
            <input/>
            <div class="search-help">Results:
            </div>
            </div>


            <div class="list">
            <span><p>test</p></span>
            <span><p>another result</p></span>
            <span><p>yet another result</p></span>
            </div>
4

4 回答 4

1

错字?

alert(sfiner)

应该

alert(sfinder)

于 2012-06-22T15:34:53.323 回答
1

尝试使用:contains() 选择器。从网站:

描述:选择所有包含指定文本的元素。匹配的文本可以直接出现在所选元素中、该元素的任何后代中,或者它们的组合中。与属性值选择器一样,:contains() 括号内的文本可以写成裸词或用引号括起来。文本必须具有匹配的大小写才能被选中。

所以对你来说:

var sfinder = $('.list p:contains(' + sresults + ')');
于 2012-06-22T15:35:53.300 回答
1

像这样的东西?

$(document).ready(function() {
     $('.mainsearch input').keyup(function () {
     var sresults = $('.mainsearch input').val();
     var sfinder = $('p:contains('+sresults+')').text();
     $('.search-help').text("Results:" + sfinder);
         alert(sfinder);
     });
});

http://jsfiddle.net/h7uYB/

更新:

尝试这个:

http://jsfiddle.net/h7uYB/2/

于 2012-06-22T15:41:04.607 回答
0

您只是想返回与输入内容匹配的段落吗?然后你想使用:contains()

$(document).ready(function() {
    $('.mainsearch input').keyup(function() {
        var sresults = $('.mainsearch input').val();
        var sfinder = $('.list p:contains("' + sresults + '")');
        //$('.search-help').append(sfinder);

        console.log(sfinder);

    });
});​

http://jsfiddle.net/mblase75/kQnTV/

不过,您可能会以此为目标:

$(document).ready(function() {
    $('.mainsearch input').keyup(function() {
        var sresults = $('.mainsearch input').val();
        var sfinder = $('.list p:contains("' + sresults + '")');
        $('.search-help').html(sfinder.clone());
    });
});​

http://jsfiddle.net/mblase75/kQnTV/1/

于 2012-06-22T15:40:26.580 回答