单击按钮时控制台发出错误" HTMLInputElement.onclick"

时间:2018-04-08 15:19:19

标签: javascript

    <script src="jquery-3.2.1.min.js">
    function ajax_post(){
        loadScript('javascript/jquery-3.2.1.min.js');
        // Create our XMLHttpRequest object
        alert("button clicked");
        // code for modern browsers
        // Create some variables we need to send to our PHP file
        var hr = new XMLHttpRequest();
        var url = "comments.php";
        var bid='<?php echo $b; ?>';
        var userid='<?php echo $userid; ?>';
        var cm = document.getElementById("latest_comment").value;
        var vars = "your_comment="+cm+"&bookid="+bid+"&uid="+userid;
        hr.open("POST", url, true);
        // Set content type header information for sending url encoded variables in the request
        hr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
        // Access the onreadystatechange event for the XMLHttpRequest object
        hr.onreadystatechange = function() {
            if(hr.readyState == 4 && hr.status == 200) {
                var return_data = hr.responseText;
                document.getElementById("comment").innerHTML = return_data;
            }
        }
        // Send the data to PHP now... and wait for response to update the status div
        hr.send(vars); // Actually execute the request
        document.getElementById("comment").innerHTML = "processing...";
    }
     </script>
  

这是javascript函数,当我点击csubmit按钮时应该运行,但是当我点击它时,控制台会在标题中写入错误。此函数必须获取输入标记中写入的数据,转到comments.php页面并将其插入数据库并在注释div中显示注释   我已经很长时间没有发现这个错误,但却无法找到错误的地方

<input type="button" id="csubmit" value="SUBMIT" onclick="ajax_post();">

2 个答案:

答案 0 :(得分:0)

ajax_post函数放入其他脚本代码中,您不能将JS代码放在已有src的脚本代码中

<script src="jquery-3.2.1.min.js"></script>
<script>
    function ajax_post() {
        loadScript('javascript/jquery-3.2.1.min.js');
        // Create our XMLHttpRequest object
        alert("button clicked");
        // code for modern browsers
        // Create some variables we need to send to our PHP file
        var hr = new XMLHttpRequest();
        var url = "comments.php";
        var bid = '<?php echo $b; ?>';
        var userid = '<?php echo $userid; ?>';
        var cm = document.getElementById("latest_comment").value;
        var vars = "your_comment=" + cm + "&bookid=" + bid + "&uid=" + userid;
        hr.open("POST", url, true);
        // Set content type header information for sending url encoded variables in the request
        hr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
        // Access the onreadystatechange event for the XMLHttpRequest object
        hr.onreadystatechange = function() {
            if (hr.readyState == 4 && hr.status == 200) {
                var return_data = hr.responseText;
                document.getElementById("comment").innerHTML = return_data;
            }
        }
        // Send the data to PHP now... and wait for response to update the status div
        hr.send(vars); // Actually execute the request
        document.getElementById("comment").innerHTML = "processing...";
    }
</script>

答案 1 :(得分:-1)

这是您的代码的问题:您的脚本位于<script>标记内,并带有src属性。如果存在src属性,则<script>标记内的内容将被完全忽略。

这应该有效:

<script src="jquery-3.2.1.min.js">
function ajax_post(){
    loadScript('javascript/jquery-3.2.1.min.js');
    // Create our XMLHttpRequest object
    alert("button clicked");
    // code for modern browsers
    // Create some variables we need to send to our PHP file
    var hr = new XMLHttpRequest();
    var url = "comments.php";
    var bid='<?php echo $b; ?>';
    var userid='<?php echo $userid; ?>';
    var cm = document.getElementById("latest_comment").value;
    var vars = "your_comment="+cm+"&bookid="+bid+"&uid="+userid;
    hr.open("POST", url, true);
    // Set content type header information for sending url encoded variables in the request
    hr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    // Access the onreadystatechange event for the XMLHttpRequest object
    hr.onreadystatechange = function() {
        if(hr.readyState == 4 && hr.status == 200) {
            var return_data = hr.responseText;
            document.getElementById("comment").innerHTML = return_data;
        }
    }
    // Send the data to PHP now... and wait for response to update the status div
    hr.send(vars); // Actually execute the request
    document.getElementById("comment").innerHTML = "processing...";
}
 </script>