1. ホーム
  2. javascript

[解決済み] jQueryでtextboxの値を設定する方法は?

2022-03-04 16:46:32

質問

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>

解決方法は?

呼び出しのレスポンスをURLに設定したいのだと思います 'compz.php?prodid=' + x + '&qbuys=' + y をテキストボックスの値として使用しますよね?もしそうなら、次のようなことをしなければなりません。

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

参考 get()

あなたのコードには2つのエラーがあります。

  • load() HTML Ajaxから返された値を指定された要素に入れる。

    サーバーからデータを読み込み、返されたHTMLをマッチした要素に配置します。

    そのメソッドでテキストボックスの値を設定することはできません。

  • $(selector).load() はjQueryの オブジェクト . デフォルトでは、オブジェクトは次のように変換されます。 [object Object] は文字列として扱われます。

さらなる明確化 :

URLが 5 .

もし、あなたのHTMLが次のようになったら。

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

という結果になります。

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

になります。

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

しかし、あなたのコードでは、input 要素がありますね。 理論的には (これは有効な HTML ではないので、あなたが気づいたように動作しません)、同等の呼び出しを行うと、次のような結果になります。

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

しかし、実際に必要なのは

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

したがって load() . 別のメソッドを使ってレスポンスを取得し、それを自分で値として設定する必要があります。