表行上的jQuery对话框不工作

我（某种程度上）重新提出了这个问题，这个问题基于上一个问题：

我提供上一个链接仅供参考

经过几个小时的努力，我决定后退一大步，重新开始，从基础做起。我的背景是，我相当精通rails编程，而对Javascript（一种la jQuery）不太感兴趣

我有一个表，希望能够使用jquery对话框更新每行中的两个字段，以提供更新它们的部分服务

我已经设法让对话框弹出部分，但是仅在第一行单击后续行上的字段链接时，不会产生任何结果（它们只是死掉）。

下面是.js：

$(document).ready(function() {
$('div#status-chg-form').dialog({ autoOpen: false });
$('#statuslink').click(function(){ $('div#status-chg-form').dialog('open'); });
});

$(document).ready(function() {
$('div#eta-chg-form').dialog({ autoOpen: false });
$('#etalink').click(function(){ $('div#eta-chg-form').dialog('open'); });
});

在我的索引页上，是在各自的对话框中为分部提供服务的div：

<div id="status-chg-form" title="CHANGE WORK ORDER STATUS" style="display:none"><%= render :partial => 'statusform' %></div>
<div id="eta-chg-form" title="CHANGE TECHNICIAN ETA" style="display:none"><%= render :partial => 'etaform' %></div>

“状态表”%>
'etaform'>

最后，以下是表中每一行重复的链接：

        <%= link_to work_order.soft_completion_datetime.strftime('%m/%d/%Y %I:%M %p'), "#", :id => "etalink" %>
        <%= link_to status_display, "#", :id => "statuslink" %> 

“etalink”%>
“状态链接”%>

我知道我的问题是一个补救性的问题，因为关于.js，有些东西我没有领会。如果有人能给我指出正确的方向，让这些对话框以最有效的方式为表格的每一行工作，我将永远欠你的债

---

为此，我已经坚持了好几天了。

1-如果您在页面上使用多个项目，请使用类而不是ID来选择要应用绑定的项目
2-您可以将

文档就绪

事件的两个块合并在一个块中
3-要使用行中的对话框选择div，可以使用

closest（）

通过指定的选择器获取最接近的父级

通过这些更改，您的代码将如下所示：

$(document).ready(function() { 
    $('div.status-chg-form').dialog({ autoOpen: false }); 
    $('.statuslink').click(function(){ $(this).closest('div.status-chg-form').dialog('open'); }); 

    $('div.eta-chg-form').dialog({ autoOpen: false }); 
    $('.etalink').click(function(){ $(this).closest('div.eta-chg-form').dialog('open'); }); 
}); 

---

1-如果您在页面上使用多个项，请使用类而不是ID来选择要应用绑定的项
2-您可以将

文档就绪

事件的两个块合并在一个块中
3-要使用行中的对话框选择div，可以使用

closest（）

通过指定的选择器获取最接近的父级

通过这些更改，您的代码将如下所示：

$(document).ready(function() { 
    $('div.status-chg-form').dialog({ autoOpen: false }); 
    $('.statuslink').click(function(){ $(this).closest('div.status-chg-form').dialog('open'); }); 

    $('div.eta-chg-form').dialog({ autoOpen: false }); 
    $('.etalink').click(function(){ $(this).closest('div.eta-chg-form').dialog('open'); }); 
}); 

---

我猜你的问题是，你的所有链接似乎都有

id=statuslink

，你不能有重复的id。如果您只需将

:id

设置为

:class

，然后将jQuery更改为使用

.statuslink

而不是

#statuslink

，它应该会修复它。对于共享相同属性的任何其他元素也是如此。

我猜您的问题是，您的所有链接似乎都有

id=statuslink

，并且不能有重复的id。如果您只需将

:id

设置为

:class

，然后将jQuery更改为使用

.statuslink

而不是

#statuslink

，它应该会修复它。对于共享相同属性的任何其他元素，都是相同的。

谢谢！！你是个救生员。谢谢你！！你是一个救生员。很棒，效率更高。很棒，效率更高。