Question

我正在使用这样的jQuery模式对话框：

<div class="dialog-form" id="dialog-form1" title="Edit Invoice">
<form>
.... inputs & selects
</form>
</div>              
<button class="dialog-button">Edit</button>

按钮的功能如下所示：

$(".dialog-button").button().click(function() {
alert ($(this).prev("div").attr("id"));
});

我现在要做的就是获取前一个div的ID（我将按钮更改为类而不是ID，因为我在同一页面上放了几个不同的弹出窗体）。所以它应该返回“dialog-form1”。但无论我尝试什么它都找不到前一个div的ID，它只返回“undefined”......

有什么想法吗？谢谢你的帮助！

Answer 1

用以下内容替换你的jQuery脚本：

$(".dialog-button").click(function() {
   alert ($(this).prev("div").attr("id"));
});

直播DEMO

Answer 2

jQuery UI Dialog小部件更改并将div中的表单移动到DOM中的单独位置 - 导致您的“prev”逻辑找不到它。

以下是我在尝试您的示例时写入我的DOM的HTML：

<div class="dialog-form ui-dialog-content ui-widget-content" id="dialog-form1" style="width: auto; min-height: 103.03333330154419px; height: auto;" scrolltop="0" scrollleft="0">
<form>
<!-- .... inputs & selects  -->
</form>
</div>

要证明这一点，请不要在“dialog-form1”ID上实例化Dialog小部件并运行脚本。它会找到它。

我会尝试在您想要查找的DIV上打一个类，然后按类选择（而不是使用“prev”）。像这样......

<div class="dialog-form" id="dialog-form1" class="my-dialog-i-want" title="Edit Invoice">
<form>
<!-- .... inputs & selects  -->
</form>
</div>              

$(".dialog-button").on("click", function(e) {
  var myDiv = $("div.my-dialog-i-want");
  alert (myDiv.attr("id"));
});

希望这会有所帮助。

单击按钮获取jquery模式对话框的div id

2 个答案: