首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >jquery选择/选项框-链接关系

jquery选择/选项框-链接关系
EN

Stack Overflow用户
提问于 2011-11-11 01:47:21
回答 3查看 715关注 0票数 0

这种情况下可以使用javascript或jquery吗?

当类为"cl_preAction“的选择框的值设置为”003“”世界末日“选项时,选择框"cl_prePRRS”01,2,03中的选项应被移除或灰显(无法选择-如果这是可能的)

请注意,此模式将在页面上重复多次,因此使用相同的id将不起作用。

代码语言:javascript
运行
复制
$('.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>
EN

回答 3

Stack Overflow用户

回答已采纳

发布于 2011-11-11 02:56:02

您的第一个问题将是禁用选择选项并不能在所有浏览器和版本中可靠地工作。最好的办法是删除不需要的选项,但也可以创建一些内容,强制用户在需要时选择另一个选项。

对于每个选择框对,您还会遇到不同规则的问题。除非你在“控制”选择框中选择了选项3,否则它总是将目标选择框中的选项1、2、3清空。

我会使用'data‘属性...

代码语言:javascript
运行
复制
    <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“属性,该属性允许您传入应该保留和/或应该删除的选项列表。您可以通过选项的索引来实现这一点,但这会有点不灵活,也更难弄清楚。

票数 0
EN

Stack Overflow用户

发布于 2011-11-11 02:44:06

链接的选择器是否总是在相邻的tr元素中?这不是一个优雅的方法,因为它在很大程度上取决于您的结构(如果您在包含两个选择器的元素之间添加一个tr元素,则此操作将失败)

代码语言:javascript
运行
复制
$('.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中删除选项。

票数 0
EN

Stack Overflow用户

发布于 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重新启用值H217F218
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/8083968

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档