Javascript 在<；选择>；标记并显示它

我想实现的是，当有人从第1列下拉列表中选择任何选项时，它应该在第2列中搜索相应的选项，并在第3列中显示其值

例如，假设有人从第1列下拉列表中选择了值3，则第3列中显示的对应值将为30

我不知道如何做到这一点-有人能给我一些指导吗？以下是我目前掌握的情况：

$(document).ready(function () {
    $("tbody tr td:nth-of-type(1)").on('change blur input', function() {

    });
});

---

如果您愿意，这是我的。

您可以通过

selectedIndex

在

selectedIndex

中获取所选项目的索引。假设

此

是

选择项

，则您可以使用此代码：

var index = this.selectedIndex;

然后，您可以使用jQuery的

.eq（）

在其他

元素中找到正确的
选项
，然后使用
text（）


首先，您需要将处理程序放在
元素上，而不是
元素上

然后，为了在第二个菜单中找到相应的选项，我在所选选项中找到其值等于小写文本的选项。然后我把它的文本放在第三栏

如果这不是你想要的，也许你可以在问题中澄清相应选项的含义

非常感谢您。只需要一个建议。我应该使用n-of-type（）还是应该使用eq（）管理所有内容。我不知道哪一个是首选的，这可能不会有太大的区别。你需要把你的问题弄清楚。到JSFIDLE的链接应该是补充性的，而不是理解问题所必需的阅读。
$(document).ready(function () {
    $("tbody tr td:nth-of-type(1)").on('change', 'select',function (e) {
        var index = this.selectedIndex;
        var parentTd = $(this).closest('td');
        var nextTd = parentTd.next();
        var text = nextTd.find('select > option').eq(index-1).prop('selected','selected').text();
        nextTd.next().text(text);
    });
});

$(document).ready(function () {
    $("tbody tr td:nth-of-type(1) select").on("change", function () {
        var thistext = $(this).find(":selected").text().toLowerCase();
        var nexttext = $(this).closest("td").next().find("option[value='" + thistext + "']").text();
        $(this).closest("td").siblings().eq(1).text(nexttext);
    });
});