Jquery选择字段填充输入字段

-2

我想从下拉列表中选择一个选项，并使用正确的值填充输入字段。Jquery选择字段填充输入字段

我要值1设置为（$ 100）VAL 2（$ 200）

我将不能访问数据库来存储的值。

<div class="row"> 
     <div class="form-group"> 
      <select class="form-control" id="costfield" name= 
      "costfield"> 
       <option value="Select Country"> Select Country</option> 
       <option value="1"> country 1</option> 
       <option value="2"> country 2</option> 
       <option value="1"> country 3</option> 
      </select> 
     </div> 
    </div> 
     <div class="form-group"> 
      <input type="estimate" class="form-control" id="exampleInputEstimate1" placeholder="Estimate"> 
     </div> 
    </div> 
    <script> 
    $("#costfield").val(); 
     $("#estimate").text("this").show(); 
    </script> 
</div>

来源

2015-09-15 bldev

如果我理解正确的问题，它应该是'$（ '＃估计'）VAL（$（ “#costfield”）.VAL（））;' – Sushil

我@Sushil同意（$（'#costfield“）.val（））;' – Michel

你的输入不能有一个'type'属性来保存这个值“估计”，这是无效的。 –

$('[name="costfield"]').change(function() { 
    console.log("test"); 
    var cost = this.value; 
    var str = ""; 

    switch (cost) { 
     case "1": 
      str = "$100"; 
      break; 
     case "2": 
      str = "$200"; 
      break; 
    } 
    $("#exampleInputEstimate1").val(str); 
});

JSFiddle

来源

2015-09-15 17:26:37

' $（'＃exampleInputEstimate1'）' – Michel

@Michel谢谢。误读了。原始HTML无效。 –

我不相信这个工作的逻辑。我已经测试过了，它不会改变成本值 – bldev

您可以使用jQuery从Select中获取值，当它发生变化时，然后相应地更改输入的值。所以把它放在脚本标签之间。

$('#costfield').on('change', function() { 
var value = $(this).val(); 
$('#exampleInputEstimate1').val(value); 
});

来源

2015-09-15 17:26:01

您可以将值存储在HTML5 data-属性为每个<option>元素。当选项的value属性与您指定的美元值之间没有直接关系时，此方法非常有用。

p/s：type="estimate"不是有效的属性值。尝试type="text"（反正，浏览器会解析无效的类型为text自动的。

// Listen to change 
 
$('#costfield').change(function() { 
 
    $('#exampleInputEstimate1').val($(this).find('option:selected').data('dollar-value')); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="row"> 
 
    <div class="form-group"> 
 
    <select class="form-control" id="costfield" name="costfield"> 
 
     <option value="Select Country">Select Country</option> 
 
     <option value="1" data-dollar-value="$100">country 1</option> 
 
     <option value="2" data-dollar-value="$200">country 2</option> 
 
     <option value="1" data-dollar-value="$100">country 3</option> 
 
    </select> 
 
    </div> 
 
</div> 
 
<div class="form-group"> 
 
    <input type="text" class="form-control" id="exampleInputEstimate1" placeholder="Estimate" /> 
 
</div>

来源

2015-09-15 17:28:25 Terry

你可以设置你的选项值是100或200然后在下拉菜单中的任何改变下设置的值您输入的值。

$("#costfield").on("change", function(){ 
    $("#exampleInputEstimate1").val($("#costfield").val()); 
});

如果你要保持你的选项值，因为它们是那么你仍然可以使用上面一样用小的变化。（在assumpti对1将是100，2为200，3将是300，依此类推）

$("#costfield").on("change", function(){ 
    $("#exampleInputEstimate1").val($("#costfield").val() + "00"); 
});

你也可以把它放到一个新的选项，并设置它没有任何价值，因为空白这样你逼用户选择一些东西。或者，您可以在文档加载时设置输入并保留您拥有的选项数量。。又名：

<option value="" ></option>

来源

2015-09-15 17:43:18 fMont

Jquery选择字段填充输入字段

回答

相关问题