Question

我第一次通过jQuery使用Ajax。我有一个HTML输入，当用户点击它并输入内容然后焦点模糊，我使用jquery调用php脚本来验证用户的输入。

我正在试图弄清楚如何在PHP中获取变量并在jQuery中进行比较。请给我任何建议

现在，当焦点模糊时，两个图像都可见。

提前致谢！

html：

<label for="FirstName">First Name</label>
     <input type="text" name="FirstName" title="First Name Here" id="firstName" />
     <img class="thumb" id="up" src="Images/thumbs_up_48.png" />
     <img class="thumb" id="down" src="Images/thumbs_down_48.png" />

CSS

img.thumb {
 visibility:hidden;
 height:0;
 width:0;
}
img.thumbV {
 visibility:visible;
 height:20px;
 width:20px;
 float:right;
}img.thumbNV {
 visibility:visible;
 height:20px;
 width:20px;
 float:right;
}

jquery：

$(document).ready(function() {
 //my attempt at ajax using jQuery
 $("#firstName").change(function() {
  sendValue($(this).val());
  $("img").removeClass('thumb').addClass('thumbV');
 });


 function sendValue(str) {
 $.post("ajax.php", {sendValue: str}, 
 function(data) {
  if(data.returnValue === true) {
   $("#up").removeClass('thumb').addClass('thumbV');
  }
  else {
   $("#down").removeClass('thumb').addClass('thumbNV');
  }
  //$("#ajax").html(data.returnValue);
 }, "json");
}

});

和PHP：

<?php 

$choice = false;

if(isset($_POST['sendValue'])) {
 $value = $_POST['sendValue'];
 if(preg_match('/^[a-zA-Z]$/', $value)) {
  $choice = true;
 }

}

echo json_encode(array("returnValue"=>$choice));

?>

Answer 1

我会保留你现在拥有的东西。

此时，我看不出是否有更好的方法，但你现在看起来很好。

Answer 2

有一行看起来很奇怪：

$("img").removeClass('thumb').addClass('thumbV');

表示您删除了类拇指，并将类thumbV添加到所有标记，使其可见。基本上意味着其中一个人class="thumbNV thumbV"而另一个人class="thumbV"

除非您打算将这些课程用于其他方面，否则我建议您只做

img.thumb { display: none; height:20px; width:20px; }

然后只使用jQuery的$('#up').hide()和$('#down').show()方法。

使用Ajax和PHP进行表单验证 - 从PHP返回一个变量以在javascript函数中使用

2 个答案: