簡體   English   中英

從下拉菜單中選擇統計信息后,使用自定義文本自動填充文本字段

[英]Autofill textfield with custom text after selected a stat from dropdown menu

我需要一些有關此腳本的幫助。 這是我從其他地方獲得的腳本,我想向其中添加一個函數,但確實很卡住。 這是腳本:

          <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天,我們會盡快通知您。”

因此,當我選擇其他狀態“已取消”時,文本字段將通過“我們已取消您的請求”來更改其內容。 等等..

如果我的描述不夠清楚,請告訴我。 非常感謝您。

您可以添加一個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

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM