Question

我有一个表格，每行都有一个选择列表。与选择列表相邻的是跨度，需要显示与所选选项相对应的跨度，以便为所选选项提供一些解释。

例如：

In each row
    if user selects the 1st option
        Show the 1st span

这个逻辑应该适用于整个表格。我有一个JS fiddle here，但我无法获得每个选项的索引值。

Answer 1

您不需要两个单独的事件。你可以简单地使用单个事件进行选择并遍历目标并显示所需的元素：

$("select").change(function(){
    $(this).parent().next().find('span').hide();           
    $(this).parent().next().find('span').eq($(this).find('option:selected').index()).show();
}).change();

<强> Working Demo

Answer 2

您可以按option:selected

获取所选选项的索引

检查DEMO

$(document).on('change', 'select', function() {
    var that = $(this);
    var val = that.val();
    var i = that.find('option:selected').index();
    that.closest('tr').find('td').eq(1).find('span').hide().eq(i).show();
});

Answer 3

试试这个，

$(document).ready(function () {
    $(document).on('change','select', function(){
        var this1=$(this);
        var i=this1.find('option:selected').index();
       $(this).closest("td").next().find("span").hide(); $(this).closest("td").next().find("span:eq("+i+")").show();
    });
});

DEMO

根据选择的第N个列表选项显示第N个跨度

3 个答案: