通过GET获取div id通过Javascript

我需要根据用户选择创建动态表单。

I.e.在第一个表单字段我选择"John Smith"，这将填充（通过外部的PHP/MySQL文件）中的第二选择字段"Artist, Carpenter, Other"，如果让我选择的艺术家我填充第三选择字段"Singer, Painter, Sculptor"等

给予我的无能JavaScript的，我花了一上午google搜索脚本，我发现一个cool tutorial here

它的工作原理，是干净的，但它与ID txtResult，这是包含在js文件静态只更新DIV（见线19和31的ajax_req.js）。我想我可以通过GET传递id名称，但我不知道如何让脚本识别变量。

这是代码：

function stateChanged() 
{ 
    if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete") 
    { 
      document.getElementById("txtResult").innerHTML= xmlHttp.responseText; 
    } 

}

我脑子里想通过通过获取ID名称，并有这样的事情：

function stateChanged() 
{ 
    if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete") 
    { 
      document.getElementById("GET[idName]").innerHTML= xmlHttp.responseText; 
    } 

}

你能帮帮我吗？我可以改变剧本太多，如果你碰巧知道的东西更好

的Ciao和谢谢，

埃德

来源

2013-09-30 Edoardo

是'idName'具有输出'div'的'id'的变量吗？如果是，只需尝试'document.getElementById（idName）...'。 – Harry

因为我使用的IDE总是将第一个拉到功能定义，所以包围它几乎引起我的焦虑。虽然我更喜欢其他语言的这种方式。 –

为什么不只是传递idname作为参数？函数stateChanged（idName） –

在你element你select通ID，

<select name="country" onchange="htmlData('city.php', 'ch='+this.value, 'your_element_id')" />

在htmlData()

function htmlData(url, qStr, id) { // get id as well that is 'your_element_id' 

    //You can do line 43 in `ajax_req.js` as, 

    xmlHttp.onreadystatechange = function() { 
            stateChanged(id); 
           } 
}

在stateChanged()

function stateChanged(id) 
{ 
    if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete") 
    { 
      document.getElementById(id).innerHTML= xmlHttp.responseText; 
    } 
    else { 
      //alert(xmlHttp.status); 
    } 
}

然后你就可以在为第31行做，

document.getElementById(id).innerHTML="";

来源

2013-09-30 10:19:20

好吧，一切工作正常。我发现实现Ajith代码更容易，即使我确信Dalım的代码可以正常工作。再一次，非常感谢你的努力，啤酒就在我身上。 – Edoardo

这是HTML ...

<!doctype html> 
    <html lang="en"> 
    <head> 
     <meta charset="UTF-8"> 
     <script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.min.js"></script> 
     <script type="text/javascript"> 
     $(function(){ 
      $.get('x.php?f_name=get_names',function(data){ 
       $("#select_name").html(data); 
       $.get("x.php?f_name=get_jobs&s_name="+$("#select_name").val(),function(data){ 
        $("#select_job").show(); 
        $("#select_job").html(data); 
       }) 
      }); 


      $("#select_name").change(function(){ 
       $.get("x.php?f_name=get_jobs&s_name="+$("#select_name").val(),function(data){ 
        $("#select_job").html(data); 
       }) 

      }); 





     }) 

     </script> 
    </head> 
    <body> 
     <select name="name" id="select_name"> 

     </select> 

     <select name="job" id="select_job"></select> 
    </body> 
    </html>

，这是PHP端（被称为x.php在代码）

<?php 
     $names = array("A","B","C"); 
     $jobs = array(array("Job_1","Job_2") ,array("Job_1"), array("Job_1","Job_2","Job_3")); 
     GLOBAL $names; 
     GLOBAL $jobs; 


     switch ($_GET['f_name']) { 
      case 'get_names': 
       get_names($names); 
       break; 
      case 'get_jobs': 
       get_jobs($jobs,$_GET['s_name']); 
       break; 
      default: 
       # code... 
       break; 
     } 





     function get_names($names){ 
      foreach ($names as $key=>$value) { 
       echo "<option value='$key'>$value</option>"; 
      } 
      return false; 
     } 
     function get_jobs($jobs,$s_name){ 
      foreach ($jobs[$s_name] as $key => $value) { 
       echo "<option value='$key'>$value</option>"; 
      } 
      return false; 
     } 



    ?>

您可以创建y我们自己的数组如$ names和$ jobs，并添加一些情况来切换到更复杂的系统...

祝您有美好的一天。

来源

2013-09-30 10:33:58

好吧，我正在研究它，我会尽快回复我做完测试。同时，谢谢大家，随意把啤酒放在我的标签上 – Edoardo

不客气） –

再次感谢Dalım's – Edoardo

通过GET获取div id通过Javascript

回答

相关问题