使用 jQuery 在选择器上递归应用 colspan 属性
这是我的 HTML 页面。如果您在浏览器中复制粘贴这个完整的 HTML，您会看到第二部分有元素和持续时间，而第三部分有元素和目标资源，在这种情况下，我想动态更改第二部分和第三部分行像第一个一样展开。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
<script type="text/javascript" src="jquery-1.4.2.js"></script>
<script type="text/javascript">
$(document).ready(function(){
});
</script>
</script>
</HEAD>
<BODY>
<table border="1">
<tr>
<th class="element_header">Elements1</th>
<th class="tr_res">TR1</th>
<th class="duration">Duration1</th>
</tr>
<tr>
<td class="element_td">Element Data 1</td>
<td class="tr_td">TR - TD - 1</td>
<td class="duration">Duration Data 1</td>
</tr>
<tr>
<th class="element_header">Elements2</th>
<th class="duration">Duration2</th>
</tr>
<tr>
<td class="element_td">Element Data 2</td>
<td class="duration">Duration Data 2</td>
</tr>
<tr>
<th class="element_header">Elements3</th>
<th class="tr_res">TR3</th>
</tr>
<tr>
<td class="element_td">Element Data 3</td>
<td class="tr_td">TR - TD - 3</td>
</tr>
</BODY>
</HTML>
This is my HTML page.. If you copy paste this complete HTML in a browser you would see that the second section has Elements and Duration while the third section has Elements and targeted resources, In this case i want to dynamically change the 2nd and 3rd row to expand like the first one.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
<script type="text/javascript" src="jquery-1.4.2.js"></script>
<script type="text/javascript">
$(document).ready(function(){
});
</script>
</script>
</HEAD>
<BODY>
<table border="1">
<tr>
<th class="element_header">Elements1</th>
<th class="tr_res">TR1</th>
<th class="duration">Duration1</th>
</tr>
<tr>
<td class="element_td">Element Data 1</td>
<td class="tr_td">TR - TD - 1</td>
<td class="duration">Duration Data 1</td>
</tr>
<tr>
<th class="element_header">Elements2</th>
<th class="duration">Duration2</th>
</tr>
<tr>
<td class="element_td">Element Data 2</td>
<td class="duration">Duration Data 2</td>
</tr>
<tr>
<th class="element_header">Elements3</th>
<th class="tr_res">TR3</th>
</tr>
<tr>
<td class="element_td">Element Data 3</td>
<td class="tr_td">TR - TD - 3</td>
</tr>
</BODY>
</HTML>
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
我会尝试将您的选择器更改为基于类而不是 id。多个控件具有相同的 id 并不是一个好习惯。另外jquery在按id选择时只选择单个项目。
另外，我会检查 length 属性而不是 boolean false，因为 jquery 总是有一个对象。因此，将您的检查更改为 .length > 0。
I would try changing your selector to be based off of the class and not the id. Not good practice to have multiple controls with the same id. Plus jquery only selects a single item when selecting by id.
Also I would check the length property rather than boolean false as jquery will always have an object. So change your checks to be .length > 0.