AJAX成功功能有效，但文件未運行

Question

我是StackOverflow，Web開發的新手，而且我的工作時間很短，所以如果我對Web開發的詞匯以及任何答案或技巧的理解較慢，我深表歉意。 我在通過ajax調用另一個php文件時遇到麻煩。 index.php：

<!--------------------------- HTML STARTUP ----------------------------------->

<!DOCTYPE html>
<html>
    <head>        
        <link type="text/css" rel="stylesheet" href="finalproject.css" />

        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
        <script type="text/javascript" src="finalproject.js"></script>

        <title>Final Project</title>
    </head>
    <body>

<!--------------------------- LOGIN ------------------------------------------>

<?php
    require_once 'dbconnection.php';

//----------------------- CREATE USERS TABLE -----------------------------------

$userspass = "CREATE TABLE usersPass (
    userID VARCHAR(60),
    password VARCHAR(60)
);";

$connected->query($userspass);

$selectAllInfo = "SELECT * FROM usersPass;";
$connected->query($selectAllInfo);

//-------------------------- LOG IN OR REGISTER --------------------------------
?>
    <form id="trial"><button onclick="OpenRegister()">Sign Up!</button>
    <script>
$(document).on("click" , "#Register", function(e)
    {
       var datastring = $("#trial").serialize();
        $.ajax({
            type: 'POST',
            url: 'userlogin.php',
            data: datastring,
            success: function(data){
            alert('Sign Up function is a success!');
        }
    });
    e.preventDefault();
});
        </script></form>
    <br/><br/>
    <button onclick="InputInfo()">Login</button> 

<?php        
$connected->close();
?>

</body>
</html>

這是調用函數時的JavaScript。 finalproject.js：

/*jslint browser: true*/
/*global $, jQuery, alert*/

function OpenRegister() {
'use strict';

$('form').append("<div id=SignInContainer>
<span style='font-size: 20px'>UserID</span>
<input type='text' name='UserID' value='Type userID here...'>
<span style='font-size: 20px'>Password</span>
<input type='text' name='UserID' value='Type password here...'>
<button id='Register'>Submit</button>
</div>");
}

$(document).ready(function () {
    'use strict';

    $(document).on('focus', 'input', function () {
        $('input').focus(function () {
            $(this).val('');
        });
    });
});

這是我要加載的php文件。 userlogin.php：

<?php echo "If this displays, you win." ?>

dbconnection.php

<?php
$connected = new mysqli('localhost', 'Username', 'Password', 'Username');
mysqli_select_db($connected, 'cferna50');

// Check connection
if ($connected->connect_error) {
    die("Connection failed: " . $connected->connect_error);
}

我只是想讓“ userlogin.php”文件通過AJAX運行。 我正在Chrome上運行此程序。 我聽說在本地文件上使用AJAX有點問題，但是我嘗試了--access-file-from-files的操作，但沒有幫助。 我嘗試在FireFox和Internet Explorer上運行它，但仍然無濟於事。 我確定我所有內容都在同一目錄中。 我正在使用在線學校服務器來完成所有這一切。 我為此一直傷腦筋，任何幫助將不勝感激。

Answer 1

僅僅因為您沒有通過方法傳遞（數據），您要么序列化數據，要么單獨傳遞它們，我想您將使用第一種方法來節省時間

<script>
    $(document).on("submit","#loginForm", function(e)
        {
           var datastring = $("#loginForm").serialize();
            $.ajax({
                type: 'POST',
                url: 'userlogin.php',
                data: datastring,
                success: function(data){
                 alert(data);
                //or
                //alert('Sign Up function is a success!');
            },
                error: function(){
                 alert("error handling");
            }
        });
        e.preventDefault();
    });
</script>

的HTML

<form id="loginForm" method="POST">
  <input type="text" name="userid" id="userid" placeholder="user ID" />
  <input type="text" name="password" id="password" placeholder="Password" />
  <button type="submit" >Submit</button>
</form>

的PHP

<?php
if(isset($_POST['userid'])){
   $username = $_POST['userid'];
   $pass = $_POST['password'];

   //do your magic now
  }
 ?>

Answer 2

在.append()處正確連接html字符串，刪除if($("#Register").click())

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script>
  function SignUp() {
  if ($("[name=username]").val().length 
     && $("[name=password]").val().length) {
    $.ajax({
      type: 'POST',
      url: 'userlogin.php',
      data: {
          username: $("[name=username]").val(),
          password: $("[name=password]").val()
      },
      success: function(data) {
        alert('Sign Up function is a success!');
      },
      error: function() {
        alert("stacsnippets success")
      }
    });
    }
  }
</script>
<script>
  function OpenRegister() {
    'use strict';

    $('body').append("<div id=SignInContainer>" 
      + "<span style='font-size: 20px'>UserID</span>" 
      + "<input type='text' name='username' placeholder='Type userID here...'>" 
      + "<span style='font-size: 20px'>Password</span>" 
      + "<input type='password' name='password' placeholder='Type password here...'>" 
      + "<button onclick='SignUp()' id='Register'>Submit</button>" 
      + "</div>");
  }
</script>
<button onclick="OpenRegister()">Sign Up!</button>

的PHP

if (isset($_POST["username"]) && isset($_POST["password"])) {
  // do username, password validation stuff here
}

jsfiddle https://jsfiddle.net/qnrnn5b5/

AJAX成功功能有效，但文件未運行

問題描述

2 個解決方案

解決方案1
1 2016-07-31 23:49:10

解決方案2
0 2016-07-31 23:31:25

AJAX成功功能有效，但文件未運行

問題描述

2 個解決方案

解決方案1 1 2016-07-31 23:49:10

解決方案2 0 2016-07-31 23:31:25

解決方案1
1 2016-07-31 23:49:10

解決方案2
0 2016-07-31 23:31:25