Jquery 从JSON接收设置选择器值

Jquery 从JSON接收设置选择器值,jquery,json,Jquery,Json,我有一个html端,从后端函数接收以下格式的JSON对象 {“p”: “off”, “h”: “off”, “t”: “32”} 我想比较我收到的值并更新select和slider选项值,例如,如果我在JSON参数中收到on,则将选择器设置为on 为此,我使用jQuery,但无论我如何尝试,我都无法让电源选择器改变值 也许真的很简单,如果你知道怎么做 有人能帮我吗 HTML和脚本 <!DOCTYPE html> <html> <head> <meta

我有一个html端,从后端函数接收以下格式的JSON对象

{“p”: “off”, “h”: “off”, “t”: “32”}
我想比较我收到的值并更新select和slider选项值,例如,如果我在JSON参数中收到on,则将选择器设置为on

为此,我使用jQuery,但无论我如何尝试,我都无法让电源选择器改变值

也许真的很简单,如果你知道怎么做

有人能帮我吗

HTML和脚本

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css"/>
<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
</head>
<body>
<div data-role="header">
<h1>TEST</h1>
</div>
<form>
<div class = "ui-field-contain">
<select id = "power">
<option option value = "0">Power OFF</option>
<option option value = "1">Power ON</option>
</select>
<select id = "heater">
<option value value = "0">Heater OFF</option>
<option value value = "1">Heater ON</option>
</select>
</div>
</form>
<label for="slider">Temp: </label>
<input type="range" name="temp" id="temp" value="38" min="20" max="42" data-highlight = "true">
<input type="submit" name="submit" id="submit" value="Set Temp">
</select>
<script>

setInterval(function() {
  updateStatus();
}, 2000); //2000mSeconds update rate

function updateStatus(){
  $.getJSON('/status.json', function(data){
    if ($('#power').html(data.p) == "off") {
        $("#power").val($("#power option:eq(0)").val());
        $("#power").selectmenu("refresh");
        }
  }).fail(function(err){
    console.log("err getJSON mesures.json "+JSON.stringify(err));
  });
};
</script>
</body>
</html>

当您执行$power.htmldata.p时,将从选择器中删除所有选项。这将元素的内容设置为data.p的值。它返回$power jQuery对象,该对象从不==off,因此if失败,其余代码永远不会运行

您可能想做的事情如下:

$("#power").val(data.p == "off" ? "0" : "1");
在演示中,我不得不使用$.post而不是$.getJSON,因为jsfiddle的AJAX服务器需要JSON请求的post方法。但这不应影响处理响应的方式

整个代码应该如下所示:

function updateStatus(){
  $.getJSON('/status.json', function(data){
    $("#power").val(data.p == "off" ? "0" : "1").selectmenu("refresh");
  }).fail(function(err){
    console.log("err getJSON mesures.json "+JSON.stringify(err));
  });
};

这不是有效的JSON。JSON字符串必须用双引号括起来,而不是用卷曲引号括起来。如果$'power'.htmldata.p==off会怎么样{should to do?$'power'.htmldata.p将select的内容替换为data.p的值。是否要写入if data.p==off?我尝试了$power.valdata.p==off?0:1;但这不起作用。我还尝试了if$power.valdata.p==off{$power.val$power选项:eq0.val;$power.selectmenurefresh;}但同样的结果似乎你只是把东西放在一起,而没有真正理解它们的作用。为什么你要把参数中的data.p==off设置为.val?这会将值设置为true或false,而不是0或1。如果它没有返回真值,为什么你会把它放在里面呢?谢谢。我不是专家,这就是为什么我是我在这个论坛上提问。我看到你的示例有效,但我的示例无效。正如你看到的,我正在使用jQuery mobile 1.4.5,如果我在你的小提琴中添加脚本源和样式表,它将不再有效。我已经更新了我的答案,以显示我认为你的整个函数应该是什么样子,包括.selectmenu调用。