當文本框爲空時隱藏div - backbone，javascript

我想顯示/隱藏div，具體取決於文本框的長度。我使用的骨幹結構，所以不知道在哪裏放置代碼..當文本框爲空時隱藏div - backbone，javascript

但這裏是我的代碼;

<input type="text" id="txtUsername" placeholder="username"><br> <input 
type="text" id="txtPassword" placeholder="password"> 

<div id="results"> 
    // text here 
</div>

$('#chooseScan').addClass('hide'); 
     if ($('txtUsername').length > 0 && $('txtPassword').length > 0) { 
      $('#results').removeClass('hide'); 
      $('#results').addClass('show'); 
     }

來源

2012-11-08 myTD

你的問題是什麼？代碼是行不通的，還是你不知道該把它放在哪裏？或者兩者兼而有之？ –

有在你的代碼一些錯誤，我沒有早點看到。

需要使用＃前面的id。
使用$（'＃txtUsername'）.val（）。length來獲得長度。
需要把jQuery的文件引用（不知道你是否把它）
$（ '＃chooseScan'）addClass（ '隱藏'）;（是chooseScan或結果？）

以下是工作代碼。

<html> 
<head> 
<script type="text/javascript" src="jquery-1.8.2.min.js"></script> 
<style type="text/css"> 
.hide { 
    visibility: hidden; 
} 
.show { 
    visibility: visible; 
} 
</style> 
<script type="text/javascript"> 
$(document).ready(function() { 

    $('#results').addClass('hide'); 
    $('#txtUsername').bind('input', function() { 

     if ($('#txtUsername').val().length > 0 && $('#txtPassword').val().length > 0) { 
      $('#results').removeClass('hide'); 
      $('#results').addClass('show'); 
     } 
}); 

}); 

</script> 

</head> 
<input type="text" id="txtUsername" placeholder="username"><br> 
<input type="text" id="txtPassword" placeholder="password"> 
<div id="results"> 

    // text here</div> 

</html>

來源

2012-11-08 17:38:35 Damitha

是的，不知道在哪裏添加此代碼..它似乎並沒有觸發... – myTD

你可以這樣keyup事件鏈接到您的文本框： DEMO

$(document).ready(function() {  
    $('#txtUsername').bind('keyup', showHideDiv); 
    $('#txtPassword').bind('keyup', showHideDiv);  
}); 


function showHideDiv(){ 
    if ($('#txtUsername').val().length > 0 && $('#txtPassword').val().length > 0) { 
     $('#results').removeClass('hide'); 
     $('#results').addClass('show'); 
    } 
    else { 
     $('#results').removeClass('show'); 
     $('#results').addClass('hide'); 

    } 
}

另外，還有一些與您的代碼幾個問題：

使用$('#InputTagId')通過ID來訪問它們
使用$('#InputTagId').val().length可以獲得其值的長度

來源

2012-11-08 18:23:41 Coder

當文本框爲空時隱藏div - backbone，javascript

回答

相關問題