Jquery 对select 事件的操作

Posted 2023-04-24

功能需求：
在select option为 “默认”时，本tr内的 input display为block
在select option不为“默认”时，本tr内的 input display为none

<tr>
<td>
<select name="category[]">
<option value="0">默认</option>
<option value="1">自定义</option>
</select>
</td>
<td>
<input style="display:block" type="text" class="txt" size="8" name="sitename[]">
</td>
</tr>
<tr>
<td>
<select name="category[]">
<option value="0">默认</option>
<option value="1">自定义</option>
</select>
</td>
<td>
<input style="display:block" type="text" class="txt" size="8" name="sitename[]">
</td>
</tr>

参考技术A function changetxt(ele)
if($(ele).val()=='0')
$('mytxt').css('display','block');

else
$('mytxt').css('display','none');



<tr>
<td>
<select name="category[]" onchange="changetxt(this)">
<option value="0">默认</option>
<option value="1">自定义</option>
</select>
</td>
<td>
<input id="mytxt" style="display:block" type="text" class="txt" size="8" name="sitename[]">
</td>
</tr>追问

嗯，这个是针对单行的，的确可以这样处理。
但实际上，我的页面里有很多行。
这样吧，我给出我的设计思路，你帮我把代码写出来，我把分给你：
$("select").change(function()

if($(this).val()=='0')

本select所在的行内，所有input设置为display:none

else

本select所在的行内，所有input设置为display:block

);

追答

用到好多个parent，children，last
$("select").change(function()
if($(this).val()=='0')
$(this).parent().parent().children().last().children().css('display','block');
else
$(this).parent().parent().children().last().children().css('display','none');
);

本回答被提问者采纳

jQuery操作Select

jQuery获取Select选择的Text和Value:

语法解释：
1. $("#select_id").change(function(){//code...});   //为Select添加事件，当选择其中一项时触发
2. var checkText=$("#select_id").find("option:selected").text();  //获取Select选择的Text
3. var checkValue=$("#select_id").val();  //获取Select选择的Value
4. var checkIndex=$("#select_id ").get(0).selectedIndex;  //获取Select选择的索引值
5. var maxIndex=$("#select_id option:last").attr("index");  //获取Select最大的索引值 


语法解释：
1. $("#select_id ").get(0).selectedIndex=1;  //设置Select索引值为1的项选中
2. $("#select_id ").val(4);   //设置Select的Value值为4的项选中
3. $("#select_id option[text=‘jQuery‘]").attr("selected", true);   //设置Select的Text值为jQuery的项选中

 

jQuery添加/删除Select的Option项：

1. $("#select_id").append("<option value=‘Value‘>Text</option>");  //为Select追加一个Option(下拉项)
2. $("#select_id").prepend("<option value=‘0‘>请选择</option>");  //为Select插入一个Option(第一个位置)
3. $("#select_id option:last").remove();  //删除Select中索引值最大Option(最后一个)
4. $("#select_id option[index=‘0‘]").remove();  //删除Select中索引值为0的Option(第一个)
5. $("#select_id option[value=‘3‘]").remove();  //删除Select中Value=‘3‘的Option
5. $("#select_id option[text=‘4‘]").remove();  //删除Select中Text=‘4‘的Option