选择 onchange 更新其他输入字段答案

【问题标题】：Select onchange update other input fields选择 onchange 更新其他输入字段
【发布时间】：2016-10-13 16:54:04
【问题描述】：

我有一个带有一个选择选项和 3 个输入文本框的表单。我从数据库中获取选择选项的值。我想根据我选择的内容更改 3 个输入字段的数据。我尝试了很多方法，但都失败了。

<Select onchange="update(this)">
<?php 
    $query = "SELECT * FROM wheel1 ORDER BY chair_no ASC";
    $run = mysqli_query($connect, $query);
    $i = 0;
    while ($chair = mysqli_fetch_assoc($start)) {
    $i++;
    ?>
<option value="<?php echo $chair['chair_no'];?>"><?php echo $i ?></option>
<?php
     $name = $chair['name'];
     $phone = $chair['phone'];
     $detail = $chair['detail'];
     }
?>

它完美地为选择菜单获取数据，但只存储姓名电话和详细信息变量的最后一个值。这是javascript代码。

function update( elem ) {
             var name = "<?php echo $name; ?>";
             var phone= "<?php echo $phone; ?>";
             var detail = "<?php echo $detail; ?>";
             document.getElementById("name").innerHTML = name;
             document.getElementById("phone").innerHTML = phone;
             document.getElementById("detail").innerHTML = detail;
}

任何帮助都可以得到。提前致谢。

【问题讨论】：

标签： javascript php jquery

【解决方案1】：

在姓名、电话和详细信息选项中设置不同的属性

演示：https://jsfiddle.net/sjhhv4pw/

<select onchange="update(this)">
<?php 
    $query = "SELECT * FROM wheel1 ORDER BY chair_no ASC";
    $run = mysqli_query($connect, $query);
    $i = 0;
    while ($chair = mysqli_fetch_assoc($start)) {
    $i++;
    ?>
<option data-name="<?php echo $chair['name']; ?>" data-phone="<?php echo $chair['phone']; ?>" data-detail="<?php echo $chair['detail']; ?>" value="<?php echo $chair['chair_no'];?>"><?php echo $i ?></option>
<?php
    }
?>
</select>

jQuery:

function update( elem ) {
     var name = $(elem).find("option:selected").attr("data-name");
     var phone= $(elem).find("option:selected").attr("data-phone");
     var detail = $(elem).find("option:selected").attr("data-detail");
}

【讨论】：

【解决方案2】：

试试下面的代码

<Select onchange="update(this)">

"数据电话=""数据椅子详细信息=""值="">

javascript 代码，考虑到您使用的是 jQuery

function update( elem ) {
         var name = ele.data('chair-name');
         var phone= ele.data('phone');
         var detail = ele.data('chair-detail');

}

【讨论】：