单击下拉菜单时，将文本粘贴到输入框中

Paste the text in input box when clicked on drop down

本文关键字：输入 文本 下拉菜单 单击      更新时间：2023-09-26

我有一个下拉列表当我点击它们时，我希望文本粘贴到具有class=粘贴的输入框中。这就是我到目前为止所做的

index.php

<select>
    <option class="others">Option 1</option>
    <option class="others">Option 2</option>
</select>
<input class="paste" disabled="disabled" autocomplete="off" type="text">

Jquery.js

$(document).on('click', '.others', function(e) {
    e.preventDefault();
    $('.paste').val($(this).text());
});

这是一个小提琴小提琴

您需要使用change事件而不是click

<select id="someSelect">
   <option class="others">Option 1</option>
   <option class="others">Option 2</option>
 </select>
$(function() {
    $("#someSelect").change(function() {
        alert( $('option:selected', this).text() );
        $('.paste').val($('option:selected', this).text());
    });
});

对于演示

$(document).on('change', '.others1', function(e) {
  e.preventDefault();
  $('.paste').val($('option:selected', this).text());
});

<select class='others1'>
  <option class="others">Option 1</option>
  <option class="others">Option 2</option>
  <option class="others">Option 3</option>
  <option class="others">Option 4</option>
</select>
<input class="paste" disabled="disabled" autocomplete="off" type="text">

演示

  1. 在select上添加类
  2. 使用更改
  3. 使用$（"选项：选定"，this）

试试这个FIDDLE。

既然您使用的是jquery，请不要忘记调用jquery库。

HTML

<select class="others">
   <option value="">select</option>
   <option value="Option 1">Option 1</option>
   <option class="Option 2">Option 2</option>
   <option class="Option 3">Option 3</option>
   <option class="Option 4">Option 4</option>
 </select>
 <input class="paste" disabled="disabled"  autocomplete="off" type="text">

jQuery

$(document).ready(function(){
  $(".others").change(function(e){
     e.preventDefault();
     $('.paste').val($(this).val());
   });
});
相关文章：