Question

<script>
$(document).ready(function() {
    $('#submitButton').submit(function(event) {
        event.preventDefault();
        $.post('http://sentiment.vivekn.com/api/text/', 
               $('#myForm').serializeArray(), 
               function(data, status) {
                    var json = JSON.parse(data);
                    $('text').html(document.getElementById('message').innerHTML);
                    $('sentiment').html(json.result.sentiment);
                    $('confidence').html(json.result.confidence);
                    console.log(json.result.sentiment);
                    console.log(status+"\n");
                });
        });
});
</script>

<section class="container content-section">
    <div class="row">
        <div class="col-lg-10 col-lg-offset-1">

            <div class="row control-group">
                <div class="form-group col-xs-12 floating-label-form-group controls">
                    <form id="myForm" method=POST action="http://sentiment.vivekn.com/api/text/">

                        <p>Enter your sentences:</p>
                        <textarea rows="5" type=text name="txt" class="form-control" placeholder="Sentences to detect" id="message" required data-validation-required-message="Please enter a message."></textarea>
                        <br>
                        <button class="btn btn-primary align-right" type="submit" id="submitButton">Submit</button>
                    </form>
                </div>
            </div>

这部分应该在页面加载时起作用，但它根本没有响应。

编辑：脚本根本不执行，我们得到的是对URL的GET请求：... index.html /？txt = [inputfrommyform]并且页面上没有任何更改，而不是页面甚至点击目标POST请求服务器。

根据评论更新。谢谢！

我们从Chrome Inspect获得的错误仍然是

未捕获的ReferenceError：$未定义

Answer 1

四个问题：

您需要收听#myForm的提交事件，而不是#submitButton，它不会发出此类事件。
你的帖子回调收到一个已经解析过的JSON对象，再次解析失败，因为需要一个字符串但是给出了一个对象。
您需要通过从提交事件处理程序返回false来阻止表单提交的默认操作。
您需要在脚本之前包含jQuery 。

固定代码：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script> $(document).ready(function() { $('#myForm').submit(function() { $.post('http://sentiment.vivekn.com/api/text/', $('#myForm').serializeArray(), function(json, status) { $('text').html(document.getElementById('message').innerHTML); $('sentiment').html(json.result.sentiment); $('confidence').html(json.result.confidence); console.log(json.result.sentiment); console.log(status + "\n"); }); return false; }); }); </script> <section class="container content-section"> <div class="row"> <div class="col-lg-10 col-lg-offset-1"> <div class="row control-group"> <div class="form-group col-xs-12 floating-label-form-group controls"> <form id="myForm" method=POST action="http://sentiment.vivekn.com/api/text/"> <p>Enter your sentences:</p> <textarea rows="5" type=text name="txt" class="form-control" placeholder="Sentences to detect" id="message" required data-validation-required-message="Please enter a message."></textarea> <br> <button class="btn btn-primary align-right" type="submit" id="submitButton">Submit</button> </form> </div> </div> </div> </div> </section>

头部定义的Javascript函数不起作用

1 个答案: