gpt4 book ai didi

javascript - Jquery .dialog 无法从表中的图像输入打开

转载 作者:行者123 更新时间:2023-12-02 18:01:33 25 4
gpt4 key购买 nike

我有 2 个选项卡,每个选项卡都有一个表格。每个表的最后一列都有一个输入 type=image 用于打开模型对话框表单。 Javascript 可以很好地隐藏表单,但当我单击任何行中的输入图像时,对话框不会打开。我希望能够向任何行添加注释。适用于简单的表单,但不适用于我在表格中使用它的方式。有什么线索吗?谢谢。

标签

<ul class="tabs">
<li class="activeTab"><a href="#tab1">En route</a></li>
<li><a href="#tab2">Arrived</a></li>
</ul>

每个选项卡都有一个表格

<thead>
<tr>
<th>Company</th>
<th>Comment</th>
<th>Add Comment</th>
</tr>
</thead>
<tbody id="enrouteShipments">
<tr id="7453">
<td>Company A</td>
<td></td>
<td><input type="image" src="images/icons/dark/pencil.png" id="addComment"></td>
</tr>
<tr id="7454">
<td>Company B</td>
<td></td>
<td><input type="image" src="images/icons/dark/pencil.png" id="addComment"></td>
</tr>
</tbody>

对话框表单(隐藏)

<div id="dialogAddCommentForm" title="Enroute Comment">
<form class="mainForm" id="addCommentForm" method="post" >
<label>Comments:</label>
<textarea rows="8" cols="" name="textarea" id= "addAComment"></textarea>
<div class="submitForm"><input type="submit" value="Add Comment" class="blueBtn" id="addCommentBtn"/></div>
</form>
</div>

脚本

$(document).ready(function() {
$( "#dialogAddCommentForm" ).dialog({ autoOpen: false, modal: true, width: 500 });
$( "#addComment" ).click(function() {
$( "#dialogAddCommentForm" ).dialog( "open" );
});
});

最佳答案

元素的 ID 必须是唯一的,使用 class 属性对相似的元素进行分组,当您使用 id 选择器时,它将仅获取具有给定 id 的第一个元素

<input type="image" src="images/icons/dark/pencil.png" class="addComment">

然后

$(document).ready(function() {
$( "#dialogAddCommentForm" ).dialog({ autoOpen: false, modal: true, width: 500 });
$( ".addComment" ).click(function() {
$( "#dialogAddCommentForm" ).dialog( "open" );
});
});

演示:Fiddle

关于javascript - Jquery .dialog 无法从表中的图像输入打开,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20484147/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com