2015-05-11 19 views
0

我在我的PHP頁面的代碼:如何在jquery上使用'onkeydown'和'onclick'?

<div id="chatarea"> 
    <div id="jqarea"> 
    <div class="chatboxcontent"></div> 
    </div> 
</div> 
<div class="chatbox"> 
    <p> 
    <input type="text" name="digit" id="digit" size="50" onkeydown="javascript:checkChatBoxInputKey(event,document.getElementById('digit').value,'<?php echo $cuser ?>')" /> 
    </p> 
    <p> 
    <button class="btn" title="send" type="button" onclick="filltxtarea(document.getElementById('digit').value,'<?php echo $cuser ?>')"> 
     <span>Send</span> 
    </button> 
    </p> 
</div> 

在我的JavaScript文件,我有這樣的功能:

function filltxtarea(desctext, uchat) { 
    $(".chatboxcontent").append('<div class=chatboxmessage><span class="chatboxmessagefrom">' + uchat + ': </span><span class="chatboxmessagecontent">' + desctext + '</span></div>'); 
    $('#digit').val(''); 
    $('#digit').focus(); 
    alert("ok2"); 
    jQuery.ajax({ 
     type: 'POST', 
     url: 'chat.php', 
     dataType: 'json', 
     data: { 
      "newrow": "desctext" 
     }, 
     success: function(response) { 
      alert(response); 
     } 
    }) 
} 

function checkChatBoxInputKey(event, desctext, uchat) { 
    if (event.keyCode == 13 && event.shiftKey == 0) { 
     alert("ok1"); 
     filltxtarea(desctext, uchat); 
    } 
} 

代碼工作爲onclick,但我與onkeypressdown一個問題。當我使用Enter鍵時,它將在聊天區域中寫入,但完成後,filltxtarea函數將刪除chatboxcontent文本。爲什麼會發生?

+0

確保您的代碼格式良好,因此受訪者可以輕鬆閱讀。請注意,您在此處使用'javascript',而不是'java'(如您最初所寫)。 –

回答

0

下面的這個解決方案已經過測試,它工作正常。

第一張:

刪除onkeydown事件的數字。它應該是這樣的:

<input type="text" name="digit" id="digit" size="50" /> 

刪除按鈕的onclick事件並設置id屬性。

<button class="btn" id="btnClick" title="send" type="button" > 

創建隱藏在你的HTML中輸入存儲$ cuser PHP變種

<input type="hidden" name="cuser" id="cuser" val="<?php echo $cuser ?>" /> 

替換您的JavaScript以下幾點:

$(document).ready(function(){  
    $("#digit").keydown(function(event){ 
      if (event.keyCode == 13 && event.shiftKey == 0) { 
       alert("ok1"); 
       filltxtarea($("#digit").val()); 
      } 
    }); 

    $("#btnClick").click(function(){ 
     filltxtarea($("#digit").val()); 
    }); 

    function filltxtarea(desctext) { 
     var uchat = $("#cuser").val(); 
     $(".chatboxcontent").append('<div class=chatboxmessage><span class="chatboxmessagefrom">' + uchat + ': </span><span class="chatboxmessagecontent">' + desctext + '</span></div>'); 
     $('#digit').val(''); 
     $('#digit').focus(); 
     alert("ok2"); 
     jQuery.ajax({ 
      type: 'POST', 
      url: 'chat.php', 
      dataType: 'json', 
      data: { 
       "newrow": "desctext" 
      }, 
      success: function(response) { 
       alert(response); 
      } 
     }) 
    } 

}); 

的任何問題,請讓我知道。

希望它有幫助。

+0

我試過marcio但不起作用......我不明白爲什麼我的cuser變量(在鉻檢查元素,我有在該字段中的值)是空的,並再次刪除我的textarea內容。我粘貼你的代碼! – Fabio