我正在使用这个js从我的数据库MYSQL中恢复一些数据，它工作得很好。
<script type = "text/javascript" >
$(document).ready(function() { // When the document is ready
$("select#product1").on("change", function() { // We attach the event onchange to the select element
var id = this.value; // retrive the product id
$.ajax({
url: "ajax.php", // path to myphp file which returns the price
method: "post", // POST request
data: "id=" + id, // I retrieve this data in my$_POST variable in ajax.php : $_POST[id]
success: function(response) { // The function to execute if the request is a -success-, response will be the price
$("input#total").val(response); // Fill the price
}
});
});
}); </script>
在我的输入#total中，我得到这个值（例如）：
[{"价格"："5"，"时间"："10"}]
如何仅获取价格值或时间值？我搜索了一些 json 解析器，但我无法将其放入我的输入中。
这是我的完整网页
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="j_idt2">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<script src="http://code.jquery.com/jquery-latest.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css" />
<script src="http://code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("select#product1").on("change", function() {
var id = this.value;
$.ajax({
url: "ajax.php",
method: "post",
data: "id=" + id,
success: function(response) {
var datashow = jQuery.parseJSON(response);
$("input#total").val(response);
}
});
});
});
</script>
</head>
<body>
<select id="product1" name="product1">
<option value="" selected="selected">-</option>
<option value='17'>Product1</option>
</select>
<input id="total" type="text" name="total" class="form-control" />
</body>
</html>
当我使用 $（"input#total"）.val（response） 选择 product1 时，这就是我进入输入字段的内容;
[{"价格"："5"，"时间"："5"}]
当我更改此行时：
$（"input#total"）.val（response）;
跟
$（"input#total"）.val（datashow.price）;
我什么都没得到。
我的 php 似乎可以正确呈现我的 json。看起来我的响应没有被解析或无法以任何方式存储到 var 中。
使用 jQuery.parseJson 解析你的响应例如，像下面这样更改您的代码
<script type = "text/javascript" >
$(document).ready(function() { // When the document is ready
$("select#product1").on("change", function() { // We attach the event onchange to the select element
var id = this.value; // retrive the product id
$.ajax({
url: "ajax.php", // path to myphp file which returns the price
method: "post", // POST request
data: "id=" + id, // I retrieve this data in my$_POST variable in ajax.php : $_POST[id]
success: function(response) { // The function to execute if the request is a -success-, response will be the price
var datashow = JSON.parse(response);
$("input#total").val(datashow[0].price);
}
});
});
}); </script>
希望这将解决您的问题
///
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="j_idt2">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<script src="http://code.jquery.com/jquery-latest.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css" />
<script src="http://code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
<script type="text/javascript">
$(document).ready(function() {
var response = [{"price":"5","time":"5"}];
$("input#total").val(response[0].price);
});
</script>
</head>
<body>
<select id="product1" name="product1">
<option value="" selected="selected">-</option>
<option value='17'>Product1</option>
</select>
<input id="total" type="text" name="total" class="form-control" />
</body>
</html>
我得到正确的结果。
使用JSON.parse();
success: function(response) {
var datashow = JSON.parse(response);
$("input#total").val(datashow.price);
}
如果要从服务器传递 Json，则必须执行此操作。以及您当前的代码。
如果您希望在成功函数中获取 json 时自动解析它，请使用dataType: "json"设置。所以你的代码必须像下面这样。
$.ajax({
url: "ajax.php", // path to myphp file which returns the price
method: "post", // POST request
dataType: "json", // <--- setting dataType
data: "id=" + id, // I retrieve this data in my$_POST variable in ajax.php : $_POST[id]
success: function(response) { // The function to execute if the request is a -success-, response will be the price
$("input#total").val(response.price); // The response would be already parsed
}
});
让我知道它是否有帮助。