0

1 つの ajax リクエストを使用して 2 つの div を変更する方法は?

ajax-update.php

<?php
include("config.inc.php");
include("user.inc.php");
$id = $_GET['id'];
$item = New item($id);
$result = $item->iteminfo;
echo $result->name."<br />";
unset($item); 
?>

html:

<tr>
<td> (one) </td>

<td><input type="text" value="" onchange="showUser<?php echo $x;?>(this.value)"  style="width:70px;"/></td>

<td><span id="txtHint<?php echo $x;?>"></span></td>

<td><input type="text" value="" name="price_<?php echo $x;?>" id="price_<?php echo $x;?>"  onchange="upperCase<?php echo $x+$h;?>()" style="width:40px;"/></td>

<td><input type="text"  id="proce_<?php echo $x;?>" style="width:70px;" value="<?php echo $x+$h;?>" disabled /></td>

<td><input type="text" value="" name="price_<?php echo $x;?>"   style="width:40px;"/></td>

<td><input type='text' id="totalPrice<?php echo $x;?>" disabled /></td>

</tr>

脚本：

function showUser<?php echo $x;?>(str)
{
if (str=="")
  {
  document.getElementById("txtHint<?php echo $x;?>").innerHTML="";
  return;
  }
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("txtHint<?php echo $x;?>").innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","ajax-update.php?id="+str,true);
xmlhttp.send();
}

私の質問は、この値を変更すると

<td><input type="text" value="" onchange="showUser<?php echo $x;?>(this.value)"  style="width:70px;"/></td>

このTDだけでなく

<td><span id="txtHint<?php echo $x;?>"></span></td>

だけでなく、このtd

    <td><input type="text"  id="proce_<?php echo $x;?>" style="width:70px;" value="<?php echo $x+$h;?>" disabled /></td>

現在、その場で 1 つの div (txtHint) のみを変更できます。

私の英語でごめんなさい。

注：たとえば、値が変更された場合、このスクリプトは単語です

xmlhttp.open("GET","ajax-update.php?id="+str,true);

そしてもう一つは

foo.php

ありがとう

アンガ

編集1：

[1] | [2] | [3]

  • [1] : i 入力値手動
  • [2] : ajax を使用したこのスパン txtHint の変更
  • [3] : [2] と同じように変更したい

編集2：

document.getElementById("txtHint<?php echo $x;?>").innerHTML=xmlhttp.responseText;
document.getElementById("proce_<?php echo $x;?>").value=xmlhttp.responseText;

これは機能しますが、[2] と [3] の値は同じです。1 つのファイル ajax-update.php から他のファイルを追加する方法を取得しますが、1 つの ajax リクエスト内にあるためです。

4

1 に答える 1

1

あなたの質問を正しく理解できれば、最初の要素 (SPAN) と 2 番目の要素 (INPUT) のテキストを変更する必要があります。

あなたが把握しているように見えるスパン-あなたはinnerHTMLを使用しています。あなたが書いた：

document.getElementById("txtHint<?php echo $x;?>").innerHTML=xmlhttp.responseText;

その下に...追加できます

document.getElementById("proce_<?php echo $x;?>").value=xmlhttp.responseText;

ただし、この種のことには jQuery の使用も検討する必要があります。それはあなたのためにクロスブラウザのものを処理し、この種のコーディングをはるかに簡単にします. 必要なすべての JSON/XML 要求を実行し、個々のコンポーネントを簡単に更新できます。

于 2013-09-22T15:35:12.653 に答える