0

ネットからダウンロードしたJavaScriptがあります。これはうまくいきます。私の問題は、この同じスクリプトを使用する必要があることですが、ページ上の 3 つのインスタンスでですか? これを実現するために、この JavaScript コードを複製または編集するにはどうすればよいですか。

背景を説明するために、ドロップダウン リストがあります。これは、onchange が以下の関数を呼び出して、ページを更新せずにテーブルに mysql データを入力します。このスクリプトは、別のページ getpersonsformedical.php からの情報を表示します。

同じ JavaScript を使用して同じページに表示したい他の 2 つのページがあります。つまり、getjobsformedical.php と getrisksformedical.php です。

どんな助けでも大歓迎です。（私のjavascriptがそれほど優れていないことをお詫びします）。

コードを別のスクリプト タグに複製することはできますか? しかし、1 つのタグ onclick に対して複数の onchange イベントを呼び出すにはどうすればよいでしょうか。これら 3 つのページはすべて、1 つの onclick から呼び出す必要があります。

これを行う他の方法があることは理解していますが、この方法論に固執できれば幸いです。

明確にするために、3 つの個別の php ページ (mysql データを含む) を 3 つの個別の .xml ファイルに表示するには、1 つの onchage イベントが必要です。

回答付きで更新

dystroy のおかげで、完全な作業スクリプトは次のとおりです。

<script> 
function showUser(userNumber, str, target, page) {  
  if (str=="")  {  
       document.getElementById(target + userNumber).innerHTML=''; 
     return;  
    }    
    var xmlhttp=new XMLHttpRequest(); 
    xmlhttp.onreadystatechange=function()  {  
      if (xmlhttp.readyState==4 && xmlhttp.status==200)   {  
        document.getElementById(target).innerHTML = xmlhttp.responseText;  
      }  
    }  
    xmlhttp.open("GET",page+"?q="+str,true);  
    xmlhttp.send();  
  }  

    function showThreeSections(userNumber, str) { 
    showUser(userNumber, str, 'a', 'getpersonsformedical.php'); 
    showUser(userNumber, str, 'b', 'getjobsformedical.php'); 
    showUser(userNumber, str, 'c', 'getrisksformedical.php'); 
    }
</script>

divに出力:

<div align="left" id="a"><font color=gray>Person Assignment will be shown here</font></div>
<div align="left" id="b"><font color=gray>Person Jobs will be shown here</font></div>
<div align="left" id="c"><font color=gray>Person Risks will be shown here</font></div>

ありがとう、ライアン

4

2 に答える 2

4

HTML ページの HEAD 要素にスクリプトを 1 回だけ含める必要がありますが、別の引数 (ページの名前) を取ります。

そして、2 番目の関数は、最初の関数を異なる引数で 3 回呼び出すことができます。

このようなもの ：

<HEAD>
 ... other things

<script>
function showUser(userNumber, str, page) { 
  if (str=="")  { 
      return; 
    }   
    var xmlhttp=new XMLHttpRequest(); 
    xmlhttp.onreadystatechange=function()  { 
      if (xmlhttp.readyState==4 && xmlhttp.status==200)   { 
        document.getElementById("txtHint" + userNumber).innerHTML += xmlhttp.responseText; 
      } 
    } 
    xmlhttp.open("GET",page+"?q="+str,true); 
    xmlhttp.send(); 
  } 

  function showThreeSections(userNumber, str) {
      document.getElementById("txtHint" + userNumber).innerHTML='';
      showUser(userNumber, str, 'getpersonsformedical.php');
      showUser(userNumber, str, 'page2.php');
      showUser(userNumber, str, 'page3.php');
  }
</script>

big 関数は、innerHTML を消去するのではなく追加することに注意してください。

そして、これを選択させることができます：

<SELECT NAME=medcondition3 id=medcondition3 onchange="showThreeSections(1, this.value)">

しかし、この解決策はおそらく悪いです。おそらく、1 つだけではなく、異なるターゲット div を埋める必要があります。ページ全体を再設計 (または少なくとも調査) せずに言うのは難しいです。

編集 ：

異なる div をターゲットにする場合は、次のことを行う必要があります。

1) 3 つの div があります。例えば

<div id=a1></div>
<div id=b1></div>
<div id=c1></div>

2) たとえば、次のようにコードを変更します。

<script>
function showUser(userNumber, str, target, page) { 
  if (str=="")  { 
       document.getElementById(target + userNumber).innerHTML='';
     return; 
    }   
    var xmlhttp=new XMLHttpRequest(); 
    xmlhttp.onreadystatechange=function()  { 
      if (xmlhttp.readyState==4 && xmlhttp.status==200)   { 
        document.getElementById(target + userNumber).innerHTML = xmlhttp.responseText; 
      } 
    } 
    xmlhttp.open("GET",page+"?q="+str,true); 
    xmlhttp.send(); 
  } 

  function showThreeSections(userNumber, str) {
      showUser(userNumber, str, 'a', 'getpersonsformedical.php');
      showUser(userNumber, str, 'b', 'page2.php');
      showUser(userNumber, str, 'c', 'page3.php');
  }
</script>
于 2012-07-02T15:13:49.560 に答える
2

xmlhttp.openこのようなif関数を作る前に、

if(str == str){
    var page = "getjobsformedical.php?q="+str;
}
else{
    var page = "getrisksformedical.php?q="+str;
}

その後、

xmlhttp.open("GET",page,true);

アップデート：

if (xmlhttp.readyState==4 && xmlhttp.status==200)   {
    if(str == 'getjobsformedical.php'){
        document.getElementById("txtHint1").innerHTML += xmlhttp.responseText; 
    }
    elseif(str == 'getrisksformedical.php'){
        document.getElementById("txtHint2").innerHTML += xmlhttp.responseText; 
    }
    elseif(str == 'page3.php'){
        document.getElementById("txtHint3").innerHTML += xmlhttp.responseText; 
    }
 }
于 2012-07-02T15:13:40.967 に答える