0

我有一个从网上下载的 javascript。这很好用。我的问题是我现在需要在页面上的三个实例上使用相同的脚本？我如何复制或编辑此 javascript 代码以实现此目的。

为了给你一个背景，我有一个下拉列表，onchange 调用下面的函数来填充一个带有 mysql 数据的表而不刷新页面。该脚本显示来自另一个页面 getpersonsformedical.php 的信息。

我现在有两个其他页面，我想使用相同的 javascript 在同一页面上显示。即getjobsformedical.php 和getrisksformedical.php。

任何帮助，将不胜感激。（抱歉我的 javascript 不是很好）。

我可以在另一个脚本标签中复制代码吗？但是然后我如何为单个标签 onclick 调用多个 onchange 事件。所有这三个页面都必须从单个 onclick 中调用。

我知道还有其他方法可以做到这一点，但如果我们能坚持这种方法，我们将不胜感激。

为了澄清，我需要一个 onchage 事件来显示三个单独的 php 页面（带有 mysql 数据）在三个单独的 .

更新答案

感谢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 元素中包含脚本，只有一次，但需要另一个参数：页面名称。

第二个函数可以用不同的参数调用第一个函数三次。

像这样的东西：

<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>

请注意，大函数添加到 innerHTML 而不是清理它。

然后你可以有这个选择：

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

但是这个解决方案可能很糟糕：你可能应该有不同的目标 div 来填充，而不是只有一个。如果不重新设计（或至少研究）整个页面，很难说。

编辑 ：

如果你想定位不同的 div，你应该：

1）有三个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 回答