如何获得选择框值在表tr jquery
how to get select box value in table tr jquery
如何在更改事件中获取trtd select box值
使用这个jquery代码只获得第一个选择框的值。
,点击第二个选择框得到相同的类第一个选择框的值
请给我一个解决这个问题的方法
任何帮助随时欢迎
这是我的jquery代码$('.sel_item_specify').change(function(){
var getval = $(".sel_item_specify option:selected" ).val();
alert('selectbox value '+getval);
if(getval == 'other'){
$(this).closest("tr").find("button").show();
$(this).closest("tr").find("input:text").show();
$(this).closest("tr").find("input:text").attr('disabled',false);
$(this).attr('disabled','disabled');
}
else{
$(".itemremove_btn").click(function(){
$(this).hide();
$(this).closest("tr").find("input:text").attr('disabled','disabled');
$(this).closest("tr").find("select").attr('disabled',false);
});
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<table id="settable" class="table table-border">
<tr>
<td class="col-md-3"><p><strong>Brand</strong></p></td>
<td class="col-md-3">
<select class="sel_item_specify form-control" rel="Brand" name="Brand">
<option class="add_textbox" value="Unbranded">Unbranded</option>
<option class="add_textbox" value="aden" +="" anais="">aden + anais</option>
<option class="add_textbox" value="Angelcare">Angelcare</option>
<option class="add_textbox" value="Babe" ease="">Babe Ease</option>
<option class="add_textbox" value="Babies"R"Us">Babies"R"Us</option>
<option class="add_textbox" value="Baby" banz="">Baby Banz</option>
<option value="other">Enter your own</option></select>
</select>
</td>
<td class="col-md-3"><input style="display:none;" name="Brand" class="form-control col-lg-11 col-sm-11 col-md-11" type="text"></td>
<td> <button type="button" class="itemremove_btn btn btn-default" style="display:none;">Remove</button></td>
</tr>
<tr>
<td class="col-md-3"><p><strong>MPN</strong></p></td>
<td class="col-md-3">
<select class="sel_item_specify form-control" rel="MPN" name="MPN">
<option class="add_textbox" value="Does" not="" apply="">Does Not Apply</option>
<option value="other">Enter your own</option></select>
</td>
<td class="col-md-3"><input style="display:none;" name="MPN" class="form-control col-lg-11 col-sm-11 col-md-11" type="text"></td>
<td> <button type="button" class="itemremove_btn btn btn-default" style="display:none;">Remove</button></td>
</tr>
</table>
在函数中使用$(this)
对象引用select box
你可以试试下面的代码
$('.sel_item_specify').change(function(){
var getval = $(this).val();
alert('selectbox value '+getval);
if(getval == 'other'){
$(this).closest("tr").find("button").show();
$(this).closest("tr").find("input:text").show();
$(this).closest("tr").find("input:text").attr('disabled',false);
$(this).attr('disabled','disabled');
}
else{
$(".itemremove_btn").click(function(){
$(this).hide();
$(this).closest("tr").find("input:text").attr('disabled','disabled');
$(this).closest("tr").find("select").attr('disabled',false);
});
}
你可以用这种简单的方法试试
$('.sel_item_specify').change(function(){
alert($(this).val());
});
<table id="settable" class="table table-border">
<tr>
<td class="col-md-3"><p><strong>Brand</strong></p></td>
<td class="col-md-3">
<select class="sel_item_specify form-control" rel="Brand" name="Brand">
<option class="add_textbox" value="Unbranded">Unbranded</option>
<option class="add_textbox" value="aden" +="" anais="">aden + anais</option>
<option class="add_textbox" value="Angelcare">Angelcare</option>
<option class="add_textbox" value="Babe" ease="">Babe Ease</option>
<option class="add_textbox" value="Babies"R"Us">Babies"R"Us</option>
<option class="add_textbox" value="Baby" banz="">Baby Banz</option>
</select>
</td>
<td class="col-md-3"><input style="display:none;" name="Brand" class="form-control col-lg-11 col-sm-11 col-md-11" type="text"></td>
<td> <button type="button" class="itemremove_btn btn btn-default" style="display:none;">Remove</button></td>
</tr>
<tr>
<td class="col-md-3"><p><strong>MPN</strong></p></td>
<td class="col-md-3">
<select class="sel_item_specify form-control" rel="MPN" name="MPN">
<option class="add_textbox" value="Does" not="" apply="">Does Not Apply</option>
<option value="other">Enter your own</option></select>
</td>
<td class="col-md-3"><input style="display:none;" name="MPN" class="form-control col-lg-11 col-sm-11 col-md-11" type="text"></td>
<td> <button type="button" class="itemremove_btn btn btn-default" style="display:none;">Remove</button></td>
</tr>
</table>
<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
使用
var getval = $(this).val();
不是var getval = $(".sel_item_specify option:selected").val();
JSFiddle
如果你想触发按钮的点击事件,如果选择的值不是"other",那么你的代码应该像这样:
$(".itemremove_btn").click(function() {
$(this).hide();
$(this).closest("tr").find("input:text").attr('disabled', 'disabled');
$(this).closest("tr").find("select").attr('disabled', false);
});
$('.sel_item_specify').change(function() {
//var getval = $(".sel_item_specify option:selected").val();
var getval = $(this).val();
alert('selectbox value ' + getval);
if (getval == 'other') {
$(this).closest("tr").find("button").show();
$(this).closest("tr").find("input:text").show();
$(this).closest("tr").find("input:text").attr('disabled', false);
$(this).attr('disabled', 'disabled');
} else {
$(".itemremove_btn").click();
}
});
JSFiddle
您的问题不够清楚,但是如果您打算捕获集合中单个项目的值。或者在有相同属性的多个元素的场景中,您可以简单地这样做:
//Any item/element with this class falls into this group
$('.td_group').each(function () {
$(this).on("change", function () {
//some custom attribute to uniquely identify each td or some element in the group
var optionID = $(this).attr('option_id');
....
//You can do as you desire, operating on individual items in the group
....
});
});
相关文章:
- Jquery - table.row(tr) is undefined
- 在同一tr-jQuery中获取td的值
- Javascript/JQuery删除代码中的父TR问题
- jQuery只隐藏<tr>在一张桌子上
- 响应式表设计:使用JQuery使click()展开tr
- jQuery将输入集中在下一个tr->td时,td包含一个输入字段,但从不关注html选择
- 通过 Jquery 调用 tr 属性并找到我的内部复选框
- 使用 JQuery 在单击表中的 tr 时创建弹出窗口
- 在 jquery 中的 TR 中查找 td 的所有输入
- jQuery选择器,用于查找包含具有特定值的TD输入的TR
- focus Using Jquery <tr> <td>
- jquery如何删除<tr>标记
- jQuery在<TR>TR折叠时标签不起作用
- jQuery父对象(“tr”)淡出不起作用
- jQuery:将tr附加到表tbody可以防止tr单击函数
- previous 10 tr jquery
- 获取动态值 tr jquery 的每个 td 值
- 隐藏/显示基于所选单选按钮的表 TR - jquery
- 将类添加到表中的 tr (JQuery)
- 如何获得选择框值在表tr jquery