onchange on onchange不起作用

时间:2014-03-07 08:38:01

标签: javascript php mysql ajax

当我从数据库构建2个下拉列表时,从第一个下拉列表中选择一个值时会创建第二个下拉列表。但是,当我在第二个选择一个选项时,我的ajax正在执行。但是当我在第二个下拉列表中只有一个值时,它将无效。即使我手动调用javascript函数。

第二次下拉:

<?
include ('../dbconnect.php');
$query = "CALL get_projects(".$userid.",".$q.")";

$result = mysql_query($query);
$countprojects = mysql_num_rows($result);

if ($countprojects != 0){

    echo '<select class="form-control" onchange="showContent(this.value)">'."\n";
    if ($countprojects > 1){
        echo "<option value='none' selected>Select project</option>";
    }
    while($rowprojecten = mysql_fetch_assoc($result)){
        echo '<option value='.$rowprojecten['projectID'].'>'.$rowprojecten['projectname'].'</option>';
        $lastvalue = $rowprojecten['projectID']; // see below why i did this
    }

    echo '</select>';

?>

我编写/复制的javascript函数:

function showContent(str)
{
if (str=="")
  {
  document.getElementById("project").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("project").innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","./includes/ajax/getcontent.php?q="+str,true);
xmlhttp.send();
}

从这个javascript中调用的phpfile:

<?
$q = intval($_GET['q']);

include ('../dbconnect.php');

$query = "CALL get_project(".$userid.",".$q.")";

$return = '<div id="project">';
$return .= $query;
$return .= '</div>';

echo $return;

mysql_close($con);

?>

为什么我在选择一个时会看到div'项目'的变化,但在创建它时是否会改变?

我试图通过将此函数添加到第一个php文件来调用函数manualy。但它也行不通。

if ($countprojects == 1){ 
  echo '<script type="text/javascript">
        showContent('.$lastvalue.')
        </script>';
}
抱歉我的英语不好,希望你能帮我解决这个问题。

1 个答案:

答案 0 :(得分:0)

这是因为第二个下拉列表中只有一个选项。如果下拉列表中只有on或zero选项,则无法触发更改事件。您可以做的是将此代码添加到选择更改时触发第一个Ajax调用的位置。并将第二个Ajax调用放在代码内部。

if ($('#selectproject').children().length == 1) {

            // make sure you have imported latest jquery. if not add this inside HTMl head  : <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
            var selectedProject = $('#selectproject').children()[0].value;
            showContent(selectedProject); // i hope this is the function you are calling when executing. if not please replace your function call here.
        }