Question

这是我的代码。从搜索到的内容我试图在它的父文件及其父文件名中获取'p'标记的索引。从代码中，如果我点击文件中的第7个'p'标签，如2.html。我需要将索引设为7，将文件名设为'2.html'。

<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta
      name="viewport"
      content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"
    />


    <script type="text/javascript" src="jquery-1.7.2.min.js"></script>



        $(document).ready(function(){                   



                var j1 = $('<div class = "cl1 cl">', {
                    'data-src': 'components/1.html'
                }).load('components/1.html');
                var j2 = $('<div class = "cl2 cl">', {
                    'data-src': 'components/2.html'
                }).load('components/2.html');
                var j3 = $('<div class = "cl3 cl">', {
                    'data-src': 'components/3.html'
                }).load('components/3.html');

                $("#search_content").append(j1);
                $("#search_content").append(j2);
                $("#search_content").append(j3);

            $('#search').click(function() { 

                var p = $("p").length;
                    //alert(p); 

                //var p = $("p").length;
                //alert(p);
                var keyword = $('.qid').val().replace(/\s+/g, " ").replace(/\s+$|^\s+/g, "");  
                var containsString = keyword;
                //alert(containsString);    
                if(keyword == ""){                  
                }else{
                    $('#search_content').css('overflow-y','scroll');
                }
                 //alert(containsString);

                $("p").removeClass('show');
                containsString = "p:contains("+containsString+")".replace("p:contains()","");                   
                //console.log(containsString);
                //alert(containsString);
                $(containsString).addClass('show');
                $('h2').show();
                $('.show').click(function () {

                    var cl = $('.show').closest(".cl");
                    var ps = cl.find('p');
                    var occurance = ps.index(this) + 1;
                    alert('occurance'+occurance);
                    alert(cl.data('src'));

                });



                if ($('.qid').val() == ''){
                    $('p').removeClass('show');

                }
            });


        });

    </script>

  </head>

  <body>



    <div id="displaybox2" style = "display:none;">
        <input class="qid" type="text"/><button id = "search">Search</button>       
        <div id = "search_content">

        </div>
    </div>
  </body>

</html>

Answer 1

将您的j1 / j2 / j3定义写为：

var j1 = $('<div class = "cl1 cl" data-src="components/1.html">').load('components/1.html');

然后

$(specific p selector here).closest('div[data-src]').attr('data-src')

这会给你'components / 1.html'（对于j1中的p标签。对于索引，可能类似

$(specific p selector here).prevAll('p').length + 1

如何从'p'标签动态获取文件名

1 个答案: