Question

我需要一些这方面的帮助。这是我从其他地方得到的脚本，我想添加一个功能，但我真的卡住了。这是脚本：

          <select name="order_status_id">
            <?php foreach ($order_statuses as $order_statuses) { ?>
            <?php if ($order_statuses['order_status_id'] == $order_status_id) { ?>
            <option value="<?php echo $order_statuses['order_status_id']; ?>" selected="selected"><?php echo $order_statuses['name']; ?></option>
            <?php } else { ?>
            <option value="<?php echo $order_statuses['order_status_id']; ?>"><?php echo $order_statuses['name']; ?></option>
            <?php } ?>
            <?php } ?>
          </select>
        </td>
      </tr>
      <tr>
        <td><?php echo $entry_notify; ?></td>
        <td><input name="notify" type="checkbox" value="1" checked="checked" /></td>
      </tr>
      <tr>
        <td><?php echo $entry_comment; ?></td>
        <td><textarea name="comment" cols="40" rows="8" style="width: 99%"></textarea>

我想从下拉菜单中选择一个名字后自动填写文本字段。例如，在下拉列表框中，我选择了状态“处理”，然后下面的文本字段将自动填充“我们正在处理您的请求。请等待X天，我们会尽快通知您。“

因此，当我选择其他状态“已取消”时，文本字段将更改其内容为“我们已取消您的请求”。等等..

如果我的描述不够明确，请告诉我。非常感谢你。

Answer 1

您可以添加一个javascript函数，它会在您的选择框的onchange事件中执行您需要的操作，如下所示：

<select id="order_status_id" name="order_status_id" onchange="updateTextBox()">
<textarea id="comment" name="comment" cols="40" rows="8" style="width: 99%"></textarea>

我还为这两个元素添加了id值，以便我们可以使用getElementById轻松选择它们

每次更改选择时都会触发此事件。然后，您将实现一个简单的javascript函数updateTextBox()，它将为您更新文本框：

function updateTextBox() {
    var orderStatusSelect = document.getElementById("order_status_id");
    var status = orderStatusSelect.options[orderStatusSelect.selectedIndex].text;
    var myTextBox = document.getElementById("comment");

    if(status == "Processing") {
        //set the value of the text box
        myTextBox.value = "We are now processing your request. Please wait for X days and we would inform you shortly." ;
    } else if(status == "Cancelled") {
        myTextBox.value = "We have cancelled your request!";
    } else if(status == "OtherStatus") {
        myTextBox.value = "another message goes here!";
    }
    //and so on for all different options
}

有关正在运行的示例，请参阅此jsFiddle。

从下拉菜单中选择统计信息后，使用自定义文本自动填充文本字段

1 个答案: