Question

以下代码有什么问题，为什么它对我不起作用.. !!!我无法获取所选数据并将其显示在文本框中。

<html>
<head>
<script type="text/javascript">
    $(document).ready(function() {                                       
    $("#name").on("change", function() {
    $("#Fname").val($(this).find("option:selected").attr("value"));
    })
 });  

</script>

<script type="text/javascript">
</script>
</head>
<body>
<div>
<select id="Fname" name ="name">
<option value="">Choose Your Value</option>
<option value="India">India</option>
<option value="UK">UK</option>
<option value="US">US</option>
<option value="UAE">UAE</option>
<option value="China">China</option>
<option value="Japan">Japan</option>    

</select>

<input type="text" id="Fname" value ="" readonly="readonly">
</div>
</body>
</html>

Answer 1

选择和输入，具有理智的“Fname”。

Answer 2

您已为输入框指定了ID并选择了相同的框。

两者都有id =“Fname”

此外，当你发现使用$（“＃”）时，它应该是你名字中DOM的id。它的名字。

但是我在这里更正了你的代码。

<html>
   </head>
   <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.js"></script>
   <script type="text/javascript">
      $(document).ready(function() {
      $("#Fname").on("change", function() { 
        $("input").val($(this).val());   
      }) });
   </script>
   </head>
   <body>
      <div>
         <select id="Fname" name ="name">
            <option value="">Choose Your Value</option>
            <option value="India">India</option>
            <option value="UK">UK</option>
            <option value="US">US</option>
            <option value="UAE">UAE</option>
            <option value="China">China</option>
            <option value="Japan">Japan</option>
         </select>
         <input type="text" id="Fname" value ="" readonly="readonly">
      </div>
   </body>
</html>

Answer 3

更改select或input的ID并将其应用于JQUery将解决您的问题。

$(document).ready(function() {                                       
    $("#Fname").on("change", function() {

    $("#SFname").val($(this).find("option:selected").attr("value"));
    })
 });

Updated Fiddle

修改

您可以在文本框中添加多个值，如：

$("#SFname").val($("#SFname").val() + " " + $(this).find("option:selected").attr("value")); })

Fiddle Link

Answer 4

请使用此代码Inter Net是必需的或复制jquery.min.js。问题是你提到的选择标签ID和输入文本ID的名称相同。

  <html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script type="text/javascript">

$(document).ready(function() {
    $("#name").on("change", function() { $("#Fname").val($(this).find("option:selected").attr("value")); }) });
</script>
</head>
<body>
<div>
<select id="name" name ="name">
<option value="">Choose Your Value</option>
<option value="India">India</option>
<option value="UK">UK</option>
<option value="US">US</option>
<option value="UAE">UAE</option>
<option value="China">China</option>
<option value="Japan">Japan</option>    

</select>

<input type="text" id="Fname" value ="" readonly="readonly">
</div>
</body>
</html>

如何纠正这个问题？

4 个答案: