Question

我在下面有php / mysqli和jquery代码，它显示了一个课程下拉菜单和一个模块下拉菜单：

    $courseactive = 1;

    $sql = "SELECT CourseId, CourseNo, CourseName FROM Course WHERE CourseActive = ? ORDER BY CourseNo"; 

    $sqlstmt=$mysqli->prepare($sql);

    $sqlstmt->bind_param("i",$courseactive);

    $sqlstmt->execute(); 

    $sqlstmt->bind_result($dbCourseId, $dbCourseNo, $dbCourseName);

    $courses = array(); // easier if you don't use generic names for data 

    $courseHTML = "";  
    $courseHTML .= '<select name="courses" id="coursesDrop" onchange="getModules();">'.PHP_EOL; 
    $courseHTML .= '<option value="">Please Select</option>'.PHP_EOL;  

    $outputcourse = "";

    while($sqlstmt->fetch()) 
    {

    $course = $dbCourseId;
    $courseno = $dbCourseNo;
    $coursename = $dbCourseName; 

    $courseHTML .= "<option value='".$course."'>" . $courseno . " - " . $coursename . "</option>".PHP_EOL;  

    if (isset($_POST['courses']) && ($_POST['courses'] == $course)) {
      $outputcourse = "<p><strong>Course:</strong> " . $courseno .  " - "  . $coursename . "</p>";
  }

    } 

    $courseHTML .= '</select>'; 

    $moduleHTML = "";  
    $moduleHTML .= '<select name="modules" id="modulesDrop">'.PHP_EOL; 
    $moduleHTML .= '<option value="">Please Select</option>'.PHP_EOL;  
    $moduleHTML .= '</select>'; 

    $pHTML = "";


    ?>

    <script type="text/javascript">

    function getModules() { 
    var course = jQuery("#coursesDrop").val(); 
    jQuery('#modulesDrop').empty(); 
    jQuery('#modulesDrop').html('<option value="">Please Select</option>'); 
    jQuery.ajax({ 
    type: "post", 
    url:  "module.php", 
    data: { course:course }, 
    success: function(response){ 
    jQuery('#modulesDrop').append(response); 
    } 
    }); 


    }


    </script>

上述代码中发生的情况是，当用户从课程下拉菜单中选择课程时，它将导航到module.php页面，在该页面中，它将执行查询并输出属于该模块的模块当然在本页的模块下拉菜单中。

但是现在我正在考虑不包括课程下拉菜单，因为它并不是真的需要。所以我只有一个模块下拉菜单。我仍然希望通过导航到module.php脚本来显示模块，以显示模块选项。

所以我的问题是我需要在jquery代码中进行哪些更改，这样当我打开上面的脚本时，它会立即执行jquery并在下拉菜单中显示模块列表（不依赖于“课程”下拉菜单，因为该下拉菜单将被删除）？

我假设jquery需要进入document.ready（）函数？

更新：

        <script type="text/javascript">

        $(document).ready( function(){
        function getModules() { 
        jQuery.ajax({ 
        type: "post", 
        url:  "module.php", 
        success: function(response){ 
        jQuery('#modulesDrop').append(response); 
        } 
        }); 
});
        }
        </script>

module.php页面：

`

     // connect to the database
 include('connect.php');

 /* check connection */
 if (mysqli_connect_errno()) {
printf("Connect failed: %s\n", mysqli_connect_error());
die();
}

$moduleactive = 1;

$sql = "SELECT ModuleId, ModuleNo, ModuleName FROM Module WHERE ModuleActive = ? ORDER BY ModuleNo"; 


 $sqlstmt=$mysqli->prepare($sql);

 $sqlstmt->bind_param("i", $moduleactive);

 $sqlstmt->execute(); 

 $sqlstmt->bind_result($dbModuleId,$dbModuleNo,$dbModuleName);


$moduleHTML  = "";  

 while($sqlstmt->fetch()) { 
     $moduleHTML .= sprintf('<option value="%1$s_%2$s_%3$s">%1$s - %2$s</option>'.PHP_EOL, $dbModuleNo, $dbModuleName, $dbModuleId);
} 


echo $moduleHTML; 

 $sqlstmt->execute(); 


?>`

Answer 1

您可以通过几种不同的方式在pageload上执行脚本：

您可以在body标签上使用内联javascript方法执行此操作：

<body onload="method()">
您可以使用jQuery执行此操作：

$(document).ready({ method(); });
您可以在声明函数后随时在javascript中执行此操作：

只需在javascript中声明该功能后随时致电method();。

Answer 2

window.onload = vs document.ready
http://4loc.wordpress.com/2009/04/28/documentready-vs-windowload/

如果在加载页面后加载了Jquery代码，那么您可以为<script>标记提供id，然后执行$("#elementid").ready(handler);

如何在页面打开时立即执行jquery代码

2 个答案: