更改文本字段一旦下拉被选中(多个窗体在一个页面上)

Change Text Field Once Drop Down Has Been Selected (Multiple forms on 1 page)

本文关键字：窗体 一个 字段 文本      更新时间：2023-09-26

我希望改变<p>标记的值，一旦从下拉菜单中选择了一个选项。我有工作，但我的问题是，我将有很多形式在一个页面上，感觉就像我在重复我的代码。是否有一种方法来做到这一点与一个函数为例?为了节省我写javascript的一个新的部分，每次一个表单被添加到我的页面?

javascript代码:

    $('.orderProduct select#packageOption').change(function(){
        $('#packagePrice').html($(this).val());
    });
    $('.orderProduct2 select#packageOption').change(function(){
        $('#packagePrice2').html($(this).val());
    });

谢谢。

为每个select添加一个data-element-id属性，如:

<select data-element-id="packagePrice">...</select>
<select data-element-id="packagePrice2">...</select>

那么你只需要这个jQuery代码:

$('select[data-element-id]').change(function(){
    var $this = $(this);
    var id = $this.data('element-id');    
    $('#' + id).html($this.val());
});

如果你想避免额外的属性，你可以使用jQuery的DOM遍历函数，以确定哪一个p你应该更新。

相关文章：