这种情况下可以使用javascript或jquery吗?
当类为"cl_preAction“的选择框的值设置为”003“”世界末日“选项时,选择框"cl_prePRRS”01,2,03中的选项应被移除或灰显(无法选择-如果这是可能的)
请注意,此模式将在页面上重复多次,因此使用相同的id将不起作用。
$('.cl_preAction').live('change', function (){
if ($(this).val() =='003'){
$(this).parent().parent()...
});
<tr>
<td>Action</td>
<td class='none'>
<div data-role='fieldcontain' class='none'>
<select name='ACTC' class='none cl_preAction' data-theme='a'>
<option data-location='S' value='001'>Fire</option>
<option data-location='T' value='002'>Flood</option>
<option data-location='T' value='003'>End Of World</option>
</select>
</div>
</td>
</tr>
<tr>
<td>Reason</td>
<td class='none'>
<div data-role='fieldcontain' class='none'>
<select name='PRRS' class='none cl_prePRRS' data-theme='a'>
<option value='01'>Rebuild</option>
<option value='02'>Relocate</option>
<option value='03'>Cash Payment</option>
<option value='04'>Send registered letter indicating this event is not covered</option>
</select>
</div>
</td>
</tr>发布于 2011-11-11 02:56:02
您的第一个问题将是禁用选择选项并不能在所有浏览器和版本中可靠地工作。最好的办法是删除不需要的选项,但也可以创建一些内容,强制用户在需要时选择另一个选项。
对于每个选择框对,您还会遇到不同规则的问题。除非你在“控制”选择框中选择了选项3,否则它总是将目标选择框中的选项1、2、3清空。
我会使用'data‘属性...
<select name='ACTC' class='none cl_preAction' data-theme='a' data-target-select="cl_prePRRS">
$('.cl_preAction').live('change', function (){
var me = $(this);
if (me.val() =='003') {
$("."+me.attr("data-target-select")).filter(function() {
return ($(this).val() != '03'); // I think you really want 04 here.
}).remove();
}
});除非迫不得已,否则不要走上试图跳过DOM的道路。它是错综复杂的,希望你永远不会需要移动一个选择框或改变页面结构。
您将注意到,此解决方案将只删除目标选择框中不是= '03‘的选项。您可以很容易地添加另一个"data“属性,该属性允许您传入应该保留和/或应该删除的选项列表。您可以通过选项的索引来实现这一点,但这会有点不灵活,也更难弄清楚。
发布于 2011-11-11 02:44:06
链接的选择器是否总是在相邻的tr元素中?这不是一个优雅的方法,因为它在很大程度上取决于您的结构(如果您在包含两个选择器的元素之间添加一个tr元素,则此操作将失败)
$('.cl_preAction').live('change', function (){
if ($(this).val() =='003') {
$(this).closest('tr').next('tr').find('.cl_prePRRS option').filter(function() {
return (parseInt($(this).val(), 10) <= 3);
}).remove();
}
});这将从DOM中删除选项。
发布于 2011-11-11 03:23:29
我很确定disabling options will only work in IE 8和更高版本。但是,在旧版本中有some interesting things you can try可以克服这一点。
这就是说,您所要求的here's an example that answers the question ;)
从本质上讲,它执行以下操作
tr标记select元素如果选择了<代码>D12<代码>H213<代码>H114如果未选择D15,则使用D16重新启用值H217F218https://stackoverflow.com/questions/8083968
复制相似问题