使用数据类型为HTML的Jquery AJAX函数

Question

We have a complete code for getting the values from PHP through Jquery AJAX with JSON datatype. 我们有一个完整的代码，用于通过带有JSON数据类型的Jquery AJAX从PHP获取值。 Here are the codes. 这是代码。

HTML CODE HTML代码

<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Ajax submit</title>
    <link href="css/main.css" type="text/css" media="screen, projection"rel="stylesheet" />
</head>

<body>
    <div id="wrapper">
        <div id="message" style="display: none;">
        </div>
        <div id="waiting" style="display: none;">
            Please wait<br />
            <img src="images/ajax-loader.gif" title="Loader" alt="Loader" />
        </div>
        <form action="" id="demoForm" method="post">
            <fieldset>
                <legend>Demo form</legend>
                <span style="font-size: 0.9em;">TEST by ROD</span>
                <p>
                    <label for="email">E-Mail:</label>
                    <input type="text" name="email" id="email" value="" />
                </p>
                <p>
                    <input type="submit" name="submit" id="submit" style="float: right; clear: both; margin-right: 3px;" value="Submit" />
                </p>
            </fieldset>
        </form>
    </div>
    <script type="text/javascript" src="js/jquery/jquery-1.3.2.js"></script>
    <script type="text/javascript" src="js/ajaxSubmit.js"></script>
</body>
</html>

PHP CODE PHP代码

sleep(3);

if (empty($_POST['email'])) {
    $return['error'] = true;
    $return['msg'] = 'You did not enter you email.';
}
else {
    $return['error'] = false;
    $return['msg'] = 'You\'ve entered: ' . $_POST['email'] . '.';
}

echo json_encode($return);

JS CODE JS代码

$(document).ready(function(){
$('#submit').click(function() {

    $('#waiting').show(500);
    $('#demoForm').hide(0);
    $('#message').hide(0);

    $.ajax({
        type : 'POST',
        url : 'post.php',
        dataType : 'json',
        data: {
            email : $('#email').val()
        },
        success : function(data){
            $('#waiting').hide(500);
            $('#message').removeClass().addClass((data.error === true) ? 'error' : 'success')
                .text(data.msg).show(500);
            if (data.error === true)
                $('#demoForm').show(500);
        },
        error : function(XMLHttpRequest, textStatus, errorThrown) {
            $('#waiting').hide(500);
            $('#message').removeClass().addClass('error')
                .text('There was an error.').show(500);
            $('#demoForm').show(500);
        }
    });

    return false;
});
  });

I just want to Move this code to HTML format, actually above these codes are made by internet user. 我只想将此代码移动到HTML格式，实际上这些代码是由互联网用户制作的。 due to my limited knowledge in AJAX/JS . 由于我对AJAX / JS的了解有限。 we are unable to make it AJAX with HTML datatype. 我们无法使用HTML数据类型制作AJAX。

The whole programme is good and according to our need. 整个计划很好，并根据我们的需要。 At the moment we just want to DISABLE the JSON and ENABLE HTML DATATYPE. 目前我们只想禁用JSON并启用HTML DATATYPE。

Answer 1

Here is a version that uses dataType html, but this is far less explicit , because i am returning an empty string to indicate an error. 这是一个使用dataType html的版本，但这不太明确 ，因为我返回一个空字符串来表示错误。

Ajax call: Ajax调用：

$.ajax({
  type : 'POST',
  url : 'post.php',
  dataType : 'html',
  data: {
      email : $('#email').val()
  },
  success : function(data){
      $('#waiting').hide(500);
      $('#message').removeClass().addClass((data == '') ? 'error' : 'success')
     .html(data).show(500);
      if (data == '') {
          $('#message').html("Format your email correcly");
          $('#demoForm').show(500);
      }
  },
  error : function(XMLHttpRequest, textStatus, errorThrown) {
      $('#waiting').hide(500);
      $('#message').removeClass().addClass('error')
      .text('There was an error.').show(500);
      $('#demoForm').show(500);
  }

}); }）;

post.php post.php中

<?php
sleep(1);

function processEmail($email) {
    if (preg_match("#^[a-zA-Z0-9_.-]+@[a-zA-Z0-9-]+.[a-zA-Z0-9-.]+$#", $email)) {
        // your logic here (ex: add into database)
        return true;
    }
    return false;
}

if (processEmail($_POST['email'])) {
    echo "<span>Your email is <strong>{$_POST['email']}</strong></span>";
}

Answer 2

var datos = $("#id_formulario").serialize();
$.ajax({         
    url: "url.php",      
    type: "POST",                   
    dataType: "html",                 
    data: datos,                 
    success: function (prueba) { 
        alert("funciona!");
    }//FIN SUCCES

});//FIN  AJAX

使用数据类型为HTML的Jquery AJAX函数

问题描述

2 个解决方案

解决方案1
13 已采纳 2011-10-12 11:36:52

解决方案2
3 2013-09-11 22:14:03

使用数据类型为HTML的Jquery AJAX函数

问题描述

2 个解决方案

解决方案1 13 已采纳 2011-10-12 11:36:52

解决方案2 3 2013-09-11 22:14:03

解决方案1
13 已采纳 2011-10-12 11:36:52

解决方案2
3 2013-09-11 22:14:03