Question

我正在努力学习ajax，坐在这里3个小时，并试图了解我需要让它运行。

我在使用Xampp的Scriptly上使用它。

这是我的代码：

<head>
    <title>Titel</title>

    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Ajax Example!</title>

    <script src="js\jquery/jquery.js"></script>

    <script>
        $(document).ready(function(){
            $("#btnSubmit").click(function(){
            //alert("hello");
                $.ajax({
                    type: "POST",
                    url: "http://localhost/inde.php",
                    data: {
                        myName: "durgesh technoclass"
                    },
                    success: function(output){
                        alert(output);
                    }
                });
            });
        });
    </script>
</head>

<body>

<form>
    <button id="btnSubmit">Click me !</button>
</form>

我甚至在Youtube上看了一个教程，并从那里复制了所有代码。教程的评级很好，代码似乎适合他，但为什么它对我不起作用？！我不明白。

Jquery可以工作，但是ajax没有。脚本只是重新加载页面而不显示任何内容。

请帮忙。

修改

可能它不起作用，因为xampp没有运行实际的服务器？

根据要求，这是"inde.php"的代码：

<?php
    echo "Welcome from Server";
?>

编辑2： 解：我弄乱了inde.php的路径。刚修好了。

它有效但代码中有错误。它由Tanvir Ahmad Sohan修正。你可以在那里找到答案。

Answer 1

试试这个......

＆＃13;

<script>
        $(document).ready(function(){
            $("#btnSubmit").click(function(event){
            event.preventDefault();
            //alert("hello");
                $.ajax({
                    type: "POST",
                    url: "http://localhost/inde.php",
                    data: {
                        myName: "durgesh technoclass"
                    },
                    success: function(output){
                        alert(output);
                    }
                });
            });
        });
    </script>

＆＃13;

当您的按钮位于表单内部时，单击该按钮时，表单将被提交到同一页面，因此它只是重新加载。要防止这种情况发生，请使用preventDefault()来防止默认行为。

如何使这项工作？

1 个答案: