Insert javascript (jquery) variable in html input field (textbox)

Question

With span and div this works

jQuery

$('#exchange_rate1').html(data[0].FinalCurrencyRate);

HTML

<span id="exchange_rate1"></span>

But if the HTML is an input element such as <input type='text' name='exchange_rate1' id='exchange_rate1' value='<?php echo $post_exchange_rate; ?>> <input type='text' name='exchange_rate1' id='exchange_rate1' value='<?php echo $post_exchange_rate; ?>> then nothing happens.

Removed php code from value the same nothing.

I also tried document.getElementById("exchange_rate1").html(data[0].FinalCurrencyRate); but I also see nothing.

Now clear, that need to use val . I just searched google for how to insert jquery variable in input field. Could not find.

Answer 1

使用jQueryObject.val(some_value)设置输入值，而不是html() 。

Answer 2

To be more specific:

// store the value you're looking to assign
var data = [
  { FinalCurrencyRate: <?= $post_echange_rate; ?> }
];

the jQuery way:

$('#exchange_rate1')               // grab the <input>
  .val(data[0].FinalCurrencyRate); // and assign it from the variable

the straight js way:

// normal JS version:
document.getElementById('exchange_rate1') // grab the <input>
  .value = data[0].FinalCurrencyRate;     // assign it

Any kind of form fields ( <input> , <select> , <textarea> ) use .val() to get/set since they don't contain child elements. .html() should be used for structural elements.

Answer 3

如果text用作

$("#exchange_rate1").val('Hello');

Answer 4

This is because you aren't supposed to be setting the innerHTML of the input element, but the value .

In jQuery you use the .val() method:

$('#exchange_rate1').val(data[0].FinalCurrencyRate);

Or with plain JavaScript, you're changing the value property of the HTMLInputElement object:

document.getElementById('exchange_rate1').value = data[0].FinalCurrencyRate;

Answer 5

对于文本输入框，请使用.val() ；对于文本区域，请使用.text() ；对于非输入类型的元素，请使用.html() 。

Answer 6

所有你需要的是

$("#exchange_rate1").val('Hello');