Javascript 未更新div标记_Javascript_Jquery_Html_Function

Javascript 未更新div标记

javascript jquery html function

Javascript 未更新div标记,javascript,jquery,html,function,Javascript,Jquery,Html,Function,我创建了一个连接到rest api的简单应用程序，如下所示： <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <script src="http://code.jquery.com/jquery-latest.min.js" > </script> <title></title> </h

我创建了一个连接到rest api的简单应用程序，如下所示：

  <!DOCTYPE html>
  <html xmlns="http://www.w3.org/1999/xhtml">
  <head>
   <script src="http://code.jquery.com/jquery-latest.min.js" >
   </script>
   <title></title>
   </head>
   <body>
    <h1 id="header">A headline</h1>
       <div id = "info"></div>
       <p1 id = "p1">p1</p1>
    <form id="name" name="name">
        Please enter a switch: <input type="text" name="switch" id = "switch">
        <input type="submit" value="submit" name="submit" id="submit">
    </form>

   <script>
        $(document).ready(function() {
            $('#name').submit(function() {
                alert('submitted');
                var switchName = $('#switch').val();
                $.getJSON('http://localhost:8081/withindex/switch','name='+switchName, processSwitches(data));
            });
        });


       function processSwitches(data) {
        alert('processSwitches');
        var infoHTML = '<p>Switch Name: ' + data.switchName +'</p>' ;
        alert(infoHTML);
        $('#info').html(infoHTML);
        $('#header').html('<h1>Switches</h1>');
       }
   </script>
   </body>
   </html>


标题
p1
请输入一个开关：
$（文档）.ready（函数（）{
$（'#name'）。提交（函数（）{
警报（“已提交”）；
var switchName=$（'#switch'）.val（）；
$.getJSON（'http://localhost:8081/withindex/switch'，'name='+switchName，processSwitches（数据））；
});
});
功能处理开关（数据）{
警报（“进程开关”）；
var infoHTML='开关名称：'+data.switchName+''；
警报（infoHTML）；
$（'#info'）.html（infoHTML）；
$（'#header'）.html（'Switches'）；
}

它运行时，将正确返回带有

infoHTML

字符串的警报，但我不明白为什么它不会用id

info

更新div标记

有人能帮忙吗

谢谢。

您正在调用

$.getJSON

函数中的

processSwitches

函数。您应该只传递该函数的名称，而不传递

（数据）

部分：

$.getJSON('http://localhost:8081/withindex/switch','name='+switchName, processSwitches);

简单地说，这是：

processSwitches

与此相反：

processSwitches(data)

编辑：

您还忘记了阻止表单提交。只需在

submit

事件处理程序的末尾添加

return false

：

$('#name').submit(function() {
    alert('submitted');
    var switchName = $('#switch').val();
    $.getJSON('http://localhost:8081/withindex/switch','name='+switchName, processSwitches);

    return false;
});

您正在调用

$.getJSON

函数中的

processSwitches

函数。您应该只传递该函数的名称，而不传递

（数据）

部分：

$.getJSON('http://localhost:8081/withindex/switch','name='+switchName, processSwitches);

简单地说，这是：

processSwitches

与此相反：

processSwitches(data)

编辑：

您还忘记了阻止表单提交。只需在

submit

事件处理程序的末尾添加

return false

：

$('#name').submit(function() {
    alert('submitted');
    var switchName = $('#switch').val();
    $.getJSON('http://localhost:8081/withindex/switch','name='+switchName, processSwitches);

    return false;
});

看起来您正在提交表单。表格提交后，数据丢失

尝试添加

return false

之后

看起来您正在提交表单。表格提交后，数据丢失

尝试添加

return false

之后

在小提琴的作品检查您的控制台的错误

字符串未定义，但无所谓

在小提琴中，检查控制台是否有错误

字符串未定义但无所谓

您是否尝试删除id和名称之间的空格？比如->id=“info”它们是id属性、等号和属性值之间的空格？您没有阻止浏览器默认提交表单您是否尝试删除id和名称之间的空格？比如->id=“info”它们是id属性、等号和属性值之间的空白？你没有阻止浏览器默认提交formOk，我这样做了，但它仍然没有更新div标记。@AkshaiShah你的网页可能在你点击警报中的

确定后被刷新。查看我的编辑。好的，我这样做了，但它仍然没有更新div标记。@AkshaiShah您的网页可能在您单击警报上的Ok
后被刷新。请参阅我的编辑。