在ajax函数中隐藏jquery元素

我试图使用jquery和$ .ajax（）方法提交表单。 在向服务器提交信息时，我只希望保留结果，并隐藏页面的其余部分。 我是否能够在ajax方法中添加条件，该方法指出“if（成功）然后显示结果，同时隐藏h1，h2和p元素（仅保留返回的文本;否则if（错误）”然后只显示错误消息在页面底部我的div占位符里面没有.hide（） – 任何元素。所以当ajax方法成功时，我希望隐藏所有元素，除了div占位符中返回的文本。如果发生错误（表单留空）然后在div占位符中显示错误消息，同时保留所有元素。

更新：

当我在我的例子中使用警报时，它们总是成功。 ajax / jquery无法识别我的if语句。 知道这里可能会发生什么吗？

HTML：

 Name:   Phone:   
  
  

jQuery的/阿贾克斯

 $(document).ready(function() { $("#clickMe").click(function(event){ event.preventDefault(); var myData = $('#form').serialize(); $.ajax({ url: 'form.php', data: myData, success: function (result) { $('#display').html(result); if(myData.indexOf("Thank")){ alert("success") } }, error: function (xhr, status, error) { $('#display').html("Error: " + xhr.status + " " + xhr.statusText); if(myData.indexOf("Something went wrong")){ alert("error"); } } }); }); }); 

PHP

  if(!empty($_GET['name']) echo "Thank you for your messsage "; else { echo "Something went wrong.; } 

Answer 1

试试这个

  $('#display').text(result); 

我希望它有所帮助

我认为添加类更好。 在你的CSS中的例子

 .test{ background-color:#000000;} 

成功

  $('#display').addClass("test"); 

或者你可以直接添加

 $('#display').css('background-color','block'); 

我以为你的问题在你的CSS中。

你忘了添加你的ajax。

  type: "post" 

Answer 2

由于您没有显示任何validation的PHP代码，我不知道您的代码看起来如何，但您必须执行以下操作：

以下内容应放在form.php文件的顶部：

 if(isset($_POST['name'])){ // return either true/false depending on validation // By default set the success message $success = true; $message = 'My success message'; // now do your conditional checks and based on that change to false // Example: when validation fails on name: if($_POST['name']==''){ $success = false; $message = 'My error message: (Name is a required field)'; } // convert array to json, so we can read it out nicely on ajax return echo json_encode($result); // stop rest of our code exit; } 

然后将您的ajax成功更改为：

请注意：

从jQuery 3.0开始，不推荐使用$.parseJSON 。 要解析JSON字符串，请使用本机JSON.parse方法。

 success: function (result) { // Read the json string to proper object, for jQuery 3.0+ use native method instead var $data = jQuery.parseJSON(result); // Check if there where no validation problems if($data.success==true){ // Write success message to DOM element $('#display').html($data.message); }else{ // Write error message to DOM element $('#display').html($data.message); } },