Question

我需要这样的东西。在更改下拉列表时，应使用适当的数据更新这两个列表。
例如如果有人选择约翰史密斯，那么在他的名字＆amp;手机号码应该更新。

HTML code：

<select id="users" name="select2" class="input-txt-smp pad2" style="width:120px;">
    <option value="all">All</option>
    <option  mobilenumber="1234567890" value="John Smith">John Smith</option>
    <option  mobilenumber="7894561230"  value="Raymond Roasrio">Raymond Roasrio</option>
</select>

<div id="usrname" class="fontblk20">  </div>
<div id="usrnum" class="fontblk14 margtop10 leftFloat margleft7"> </div>

jQuery代码

$("#users").change(function()
{
    $('.scrsngl-outbor').show()
         var selected = $(this).find(':selected');

         $("#usrname").text(selected.val());
         $("#usrnum").text(selected.attr('mobilenumber'));
}

从上述代码可以使用。即使您选择了第二个选项，也会使用适当的数据更新。

我的问题是，

1）这是实现这一任务的正确方法。我觉得不对，因为它不仅仅是两个<div>（姓名和号码）的问题，还有更多的字段需要更新。例如，电子邮件ID，出生日期等等......

2）我对json好，但如何合并

3）我不想要if else语句或者(if(usrname == John Smith ......) )，因为它将会更新dynamic dropdown users，因此不会有硬代码。

提前致谢..

Answer 1

将数据属性应用于具有div的id的选项以更新值，然后您可以使用类似于以下的jquery：

<option data-update="phone-number-div" value="1234">Phone Number</option>

$("#" + selected.data("update")).text(selected.attr("value"));

<div id="phone-number-div">Update me</div>

在更改下拉列值时，应使用适当的数据更新<div>

1 个答案: