【问题标题】:extract html table information based on radio button checked根据选中的单选按钮提取html表格信息
【发布时间】:2010-12-21 03:38:57
【问题描述】:
使用下面的示例,我可以使用哪些选择器组合来获取包含“价格”的文本? (假设用户点击了单选按钮和提交按钮)
<table border="1" id="modal_table">
<tbody>
<tr>
<td> <input type="radio" name='sub' value="509"/> </td>
<td> 509 </td>
<td class='price'> Price is $99 </td>
</tr>
<tr>
<td> <input type="radio" value="510"/> </td>
<td> 510 </td>
<td id="price"> Price is $88 </td>
</tr>
</table>
<input type='button' id='idButton2' value="Submit">
- 获取选中的单选按钮后面的 td 单元格的内容,或
- 获取选中的单选按钮后面由 id=price 标识的 td 单元格的内容
【问题讨论】:
标签:
javascript
jquery
button
radio-button
selected
【解决方案1】:
$('tr input[name=sub]:checked').parent().find('#price').html()
【解决方案2】:
很好的答案!我必须将 parent() 更改为 parents() 才能使其正常工作。代码如下:
<script type="text/javascript">
$(document).ready(function(){
$("#myButton").click(function () {
val1 = $("td input[name='sub']:checked").parents().find('.desc').html();
val2 = $("td input[name='sub']:checked").parents().find('.price').html();
if (val1 == null){
alert("Please select one value above");
} else {
alert(val1 + " sells for " + val2);
};
});
});
</script>
<table border=1>
<tr>
<td>Select</td><td>Product</td>
<td>Description</td><td>Price</td>
</tr>
<tr>
<td><input type='radio' name='sub' value='ABCDE'></td>
<td>ABCDE</td>
<td class='desc'>Product ABCDE</td>
<td class='price'>55.95</td>
</tr><tr>
<td><input type='radio' name='sub' value='GHIFK' ></td>
<td>GHIFK</td>
<td class='desc'>Product GHIFK</td>
<td class='price'>34.99</td>
</tr>
</table>
<input type='button' id='myButton' value="Click Me">