一進(jìn)去是一個(gè)黑幕,然后有一個(gè)小面板需要輸入名字,旁邊有一個(gè)按鈕確認(rèn)(第一個(gè)keypress),確認(rèn)之后黑幕和面板都消失,進(jìn)入頁面。頁面是個(gè)聊天室,觸發(fā)回車發(fā)送消息(第二個(gè)keypress)。
現(xiàn)在的問題是,在輸入名字那個(gè)面板時(shí),按回車會(huì)同時(shí)把上面的兩個(gè)keypress都觸發(fā)了。但我兩個(gè)keypress綁定的選擇器都是不一樣的。
P.S.在html內(nèi),兩個(gè)button的type都是button。
求大大解答,非常感謝。
代碼:
//get username function getUsername(){ blackScreen.fadeOut("slow"); return $("#input-username").val(); } okay.click(getUsername); //send msg to database by enter formUsername.keypress(function(event) { if(event.keyCode === 13) { event.preventDefault(); okay.trigger("click"); } }); //get time function getTime() { var mydate = new Date(); var year = mydate.getFullYear(); var month = mydate.getMonth() + 1; var day = mydate.getDate(); var hour = mydate.getHours(); var minute = mydate.getMinutes(); var second = mydate.getSeconds(); //standardize time function stdTime(s) { if(s < 10) { return "0" + s; } else { return s; } }; return year + "/" + stdTime(month) + "/" + stdTime(day) + " " + stdTime(hour) + ":" + stdTime(minute) + ":" + stdTime(second); } //send msg to database by click inputBtn.click(function() { var inputMsg = $("#input-value").val(); //push msg to database msgs.push({ "name": getUsername(), "time": getTime(), "msg": inputMsg }); $("#input-value").val(""); }); //send msg to database by enter inputForm.keypress(function(event) { if(event.keyCode === 13) { event.preventDefault(); inputBtn.trigger("click"); } });
補(bǔ)上html兩個(gè)button部分的代碼:
<div class="chat-room-input"> <form class="form-inline form-input"> <div class="form-group"> <input type="text" class="form-control" id="input-value" placeholder="來一起吐槽~" maxlength="80"> <button type="button" class="btn btn-default" id="input-send"> <span class="glyphicon glyphicon-send" aria-hidden="true"></span> </button> </div> </form> </div> <div class="alert alert-warning alert-dismissible" role="alert"> <form class="form-inline form-username"> <div class="form-group"> <input type="text" class="form-control" id="input-username" placeholder="騷年!留下大名!" maxlength="10" autofocus="autofocus"> <button type="button" class="btn btn-default okay">OK</button> </div> </form> </div>
formUsername.keypress(function(event) { if(event.keyCode === 13) { event.preventDefault(); okay.trigger("click"); } event.stopImmediatePropagation(); });
formUsername.keypress(function(event) { event.stopPropagation(); //防止事件冒泡 if(event.keyCode === 13) { event.preventDefault(); okay.trigger("click"); } }); inputForm.keypress(function(event) { event.stopPropagation();//防止事件冒泡 if(event.keyCode === 13) { event.preventDefault(); inputBtn.trigger("click"); } });
我找到答案了,只要在提交用戶名的那個(gè)回車事件添加一個(gè)event.stopImmediatePropagation();就可以了,感謝你提供了思路給我。
聲明:本網(wǎng)頁內(nèi)容旨在傳播知識(shí),若有侵權(quán)等問題請及時(shí)與本網(wǎng)聯(lián)系,我們將在第一時(shí)間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com