Question

问题：当我点击按钮键入=＆＃34;按钮＆＃34;它显示所有数据。但如果我将其更改为type =＆＃34;提交＆＃34;它没有显示数据。我想要的是转换这个类型=＆＃34;按钮＆＃34;输入=＆＃34;提交＆＃34;那将显示数据。

这是我的代码：

<form name="chatform">
                               <div class="input-group" id="msg">
                                   <input type="text" class="form-control" name="inputmsg" placeholder="Enter message here. . ." id="inputmsg">
                                   <span class="input-group-btn">
                                      <button class="btn btn-success" type="button" name="btn-send" id="cnd" onClick="submitChat()">Send</button>
                                   </span>
                               </div>
                           </form>

ajax w / jquery

function submitChat(){
            if(chatform.inputmsg.value== ""){
                alert("fill in blanks");
                return;
              }
              var msg = chatform.inputmsg.value;
              var xhttp = new XMLHttpRequest();
              xhttp.onreadystatechange = function(){
                if(xhttp.readyState == 4 && xhttp.status==200){
                  document.getElementById("chatlogs").innerHTML = xhttp.reponseText ? xhttp.reponseText : "";
                }
              };
              xhttp.open("GET","insert.php?msg="+msg, true);
              xhttp.send();
              $(document).ready(function(){
                $.ajaxSetup({cache:false});
                setInterval(function(){
                  $("#chatlogs").load("logs.php");
                }, 2000);
              });
              document.getElementById("inputmsg").value = "";
        }

Answer 1

您需要停止正常执行提交。这是最终的代码：

$("#inputmsg").keypress(function(e){
    if(e.which == 13){
        e.preventDefault();
        submitChat();
    }
});

$("#cnd").click(function(e){
    e.preventDefault();
    submitChat();
});

function submitChat(){
    if(chatform.inputmsg.value== ""){
        alert("fill in blanks");
        return;
    }
    var msg = chatform.inputmsg.value;
    var xhttp = new XMLHttpRequest();
    xhttp.onreadystatechange = function(){
        if(xhttp.readyState == 4 && xhttp.status==200){
            document.getElementById("chatlogs").innerHTML = xhttp.reponseText ? xhttp.reponseText : "";
        }
    };
    xhttp.open("GET","insert.php?msg="+msg, true);
    xhttp.send();
    $(document).ready(function(){
        $.ajaxSetup({cache:false});
        setInterval(function(){
            $("#chatlogs").load("logs.php");
        }, 2000);
    });
    document.getElementById("inputmsg").value = "";
}

然后在html按钮中删除click功能：

<button class="btn btn-success" type="button" name="btn-send" id="cnd">Send</button>

这应该可以解决您的问题。

转换类型按钮以使用ajax和jquery提交

1 个答案: