javascript - 如何在 jQuery 中设置文本框的值？

Question

如何使用 jQuery 将特定值正确加载到文本框中？尝试了下面的一个，但我得到了 [object Object] 作为输出。请赐教，我是 jQuery 的新手。

proc = function(x, y) {
  var str1 = $('#pid').value;
  var str2 = $('#qtytobuy').value;
  var str3 = $('#subtotal').load('compz.php?prodid=' + x + '&qbuys=' + y);
  $('#subtotal').val(str3);
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>


<form name="yoh" method="get">
  Product id: <input type="text" name="pid" value=""><br/> 
  Quantity to buy:<input type="text" name="qtytobuy" value="" onkeyup="proc(document.yoh.pid.value, this.value);"></br>

  Subtotal:<input type="text" name="subtotal" id="subtotal" value=""></br>
  <div id="compz"></div>

</form>

Answer 1

我认为您想将对 URL 'compz.php?prodid=' + x + '&qbuys=' + y 的调用响应设置为文本框的值，对吗？如果是这样，您必须执行以下操作:

$.get('compz.php?prodid=' + x + '&qbuys=' + y, function(data) {
    $('#subtotal').val(data);
});

引用:get()

您的代码中有两个错误:

• load()将从 Ajax 返回的 HTML 放入指定的元素中:

  Load data from the server and place the returned HTML into the matched element.

  您不能使用该方法设置文本框的值。

• $(selector).load() 返回一个 jQuery 对象。默认情况下，对象在被视为字符串时会转换为 [object Object]。

进一步说明:

假设您的 URL 返回 5。

如果您的 HTML 看起来像:

<div id="foo"></div>

然后结果

$('#foo').load('/your/url');

会是

<div id="foo">5</div>

但是在您的代码中，您有一个输入元素。 理论上(它不是有效的 HTML 并且不会像您注意到的那样工作)，等效调用将导致

<input id="foo">5</input>

但你其实需要

<input id="foo" value="5" />

因此，您不能使用load()。您必须使用另一种方法，获取响应并自己将其设置为值。