Question

我的页面上有这样的代码：

<div class="item item_wall id1"></div>
<div class="item item_wall id2"></div>
<div class="item item_wall id3"></div>
<div class="item item_wall id4"></div>
<div class="item item_wall id5"></div>

我想在jquery中使用某些内容，以便在单击“item”类的div时，它将从页面加载另一个div，页面的文件名将取决于单击的div。我希望它能加载：

？
something.php键入= item_wall和ID = ID1

为了将来参考，我最终得到了：

<div id="itemstable" class="item_love">
    <div class="id1"></div>
    <div class="id2"></div>
    <div class="id3"></div>
    <div class="id4"></div>
    <div class="id5"></div>
    <div class="id6"></div>
</div>

jQuery的：

<script>
$("#itemstable div").click(function(){
    var url = "something.php?type=" + $(this).parent().attr("class") + "id=" + $(this).attr("class");
    alert(url);
}); 
</script>

Answer 1

对于XHTML有效文档，最简单的方法是在主DIV下添加不可见的子DIV。例如：

<div class="item">
  <div class="variable type">item_wall</div>
  <div class="variable id">1</div>
</div>

您可以使用.find（）找到“自定义属性”。 E.g：

$(".item").click(function() {
    var type = $(this).find(".type").val();
    var url = "something.php?type=" + type;
    windows.location = url;
});

一点意见：应该避免将数据与UI混合。

Answer 2

回应Spencer Ruport的回答，当使用jQuery使用除class之外的自定义属性时，可以使这更容易。

例如，您的DIV可能如下所示：

<div class="item" type="item_wall" id="1"></div>

您可以轻松创建jQuery选择器和事件，如下所示：

$(".item").click(function() {
    var url = "something.php?type=" + $(this).attr("type");
    windows.location = url;
});

当然，不要忘记检查有效性，不要相信用户输入（您的HTML可以被恶意用户重写）。

根据类名加载页面

2 个答案: