0

嗨,我在 jquery 中有三个选项卡,

如果选择了以下两个字段,我想禁用第二个和第三个选项卡,第一个选项卡上的选项“否”。

<!--    Chest compressions performed    -->
<tr id="ContainerQ110I1039">
    <td>Chest compressions performed&nbsp;</td>
    <td><select name="Q110I1039" id="Q110I1039">
            <option value=""  ></option>
            <option value="0"  >No</option>
            <option value="1"  >Yes</option>
        </select>
    </td>
 </tr>
<!--    Defibrillation delivered    -->
<tr id="ContainerQ111I1040">
    <td>Defibrillation delivered&nbsp;</td>
    <td><select name="Q111I1040" id="Q111I1040" >
            <option value=""  ></option>
            <option value="0"  >No</option>
            <option value="1"  >Yes</option>
        </select>
    </td>
 </tr>

以下是标签

<ul class='tabs'>
 <li><a href='#tab1'>2222 calls</a></li>
 <li><a href='#tab2'>Cardiac Arrest</a></li>
 <li><a href='#tab3'>Outcome </a></li>
</ul>

以下是到目前为止的jquery

<script language="javascript">
        // Wait until the DOM has loaded before querying the document
        $(document).ready(function(){
            $('ul.tabs').each(function(){
                // For each set of tabs, we want to keep track of
                // which tab is active and it's associated content
                var $active, $content, $links = $(this).find('a');

                // If the location.hash matches one of the links, use that as the active tab.
                // If no match is found, use the first link as the initial active tab.
                $active = $($links.filter('[href="'+location.hash+'"]')[0] || $links[0]);

                $active.addClass('active');
                $content = $($active.attr('href'));

                // Hide the remaining content
                $links.not($active).each(function () {
                    $($(this).attr('href')).hide();
                });

                // Bind the click event handler
                $(this).on('click', 'a', function(e){
                    // Make the old tab inactive.
                    $active.removeClass('active');
                    $content.hide();

                    // Update the variables with the new link and content
                    $active = $(this);
                    $content = $($(this).attr('href'));

                    // Make the tab active.
                    $active.addClass('active');
                    $content.show();

                    // Prevent the anchor's default click action
                    e.preventDefault();
                });


            });
        });
    </script>

非常感谢

4

1 回答 1

1

使用 jQuery,你也许可以实现这样的东西:

$("select").change(function () {
    if ($("#Q110I1039").find(":selected").text() == "No" && $("#Q111I1040").find(":selected").text() == "No") {
        $(".tabs li").not(":first-child").find("a").addClass("disabled");
    }
});

我们在这里所做的是,每次我们选择一个答案时,我们都会检查两个答案是否都设置为NO。如果是这种情况,我们将添加到所有选项卡,除了第一个选项卡,禁用类。

然后我们添加此代码以“阻止”选项卡:

$(document).on("click", ".disabled", function () {
    return false;
});

因此,如果您单击它们,则不会发生任何事情。

这是一个演示

于 2013-02-05T12:11:47.403 回答