0

我的代码以编程方式创建<span>具有自定义 ID 的节点。我正在尝试使用 Jquery 访问特定的,但它不想为我工作。

的HTML:

 <div id="container">
    <div id="header">
        <span id="menu">
        </span>
        <center></center>
        <span id="refresh" runat="server">
        </span>
    </div>
    <div id="content" runat="server">
    <ul id="list" runat="server"></ul>
    </div>
    <div id="article" runat="server">
    </div>
</div>

jQuery:

$(document).ready(function () {
    $("a").click(function () {
        var post = $(this).data('postid'); //this works and returns the postID selected.
        $('#list').slideUp(); //this hides all the anchor tags
        $('#' + 'post' + post).show(); //This is what is not working
    });
}); 

.net c#

    foreach (SyndicationItem item in feed.Items)
    {
        subject[count] = item.Title.Text;
        date[count] = item.PublishDate.DateTime.ToString();

        summary[count] = item.Summary.Text;
        list.InnerHtml += "<a href=\"#\" data-postid=\"" + count +"\"><li id=\"post" + count + "\"><span id=\"bold\">" + subject[count] + "</span><br>" +
           "<span id=\"posted-date\">Posted on: " + date[count] + "</span></li></a>";
        article.InnerHtml += "<span style=\"display: none;\" class=\"post\" id=\"post" + count + "\">" + summary[count] + "</span><br>";
        count++; 
    }

几乎当我单击一个锚节点时,它会抓取 postID 并隐藏我拥有的锚标签列表,并假设显示(取消隐藏)具有 postID 的帖子。

如果您需要更多信息,请告诉我。

4

3 回答 3

3

您的 ID 不是唯一的。

你有<li id=\"post" + count + "\"><span style=\"display: none;\" class=\"post\" id=\"post" + count + "\">"。这将返回类似的东西<li id="post42"> <span style="display: none;" class="post" id="post42">其中一个 id 被使​​用了两次。

确保使用唯一的 ID,该show()方法将起作用。

于 2013-05-17T16:42:06.590 回答
3

您不能复制 element id's。您的<span><li>元素都使用 id "post" + count,当您调用.show()它时,它只会抓取与 this 匹配的第一个元素id,在这种情况下<li>

于 2013-05-17T16:43:19.020 回答
0

几乎当我单击一个锚节点时,它会抓取 postID 并隐藏我拥有的锚标签列表,并假设显示(取消隐藏)具有 postID 的帖子。

假设帖子链接的顺序与帖子本身相同,您真的需要帖子 ID 吗?下面的重构怎么样:

// The posts links

<ul class="posts_list"> 
    <li>Post Number 1 title</li>
    <li>Post Number 2 title</li>
    <li>Post Number 3 title</li>
    <li>Post Number 4 title</li>
</ul>


// the full posts

<ul class="posts"> 
    <li>Post number 1. bla bla bla</li>
    <li>Post number 2. bla bla bla</li>
    <li>Post number 3. bla bla bla</li>
    <li>Post number 4. bla bla bla</li>
</ul>

查询:

posts = $(".posts>li");

$(".posts_list").find("li").click(function(){

index = $("li").index(this);

posts.hide();
posts.eq(index).show();

});

JS斌

于 2013-05-17T16:31:46.463 回答