0

テキストボックスの長さに応じて、divを表示/非表示にします。バックボーン構造を使用しているので、コードを配置する場所がわかりません。

しかし、これが私のコードです。

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

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

js

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

2 に答える 2

0

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');

    }   
}

また、コードにはいくつかの問題があります。

  1. $('#InputTagId')IDでそれらにアクセスするために使用します
  2. $('#InputTagId').val().lengthそれらの値の長さを取得するために使用します
于 2012-11-08T18:23:41.607 に答える
0

私が以前に見なかったあなたのコードのいくつかのエラーがありました。

  1. IDの前に＃を使用する必要があります。
  2. $（'＃txtUsername'）。val（）。lengthを使用して長さを取得します。
  3. jqueryファイル参照を配置する必要があります（配置するかどうかわからない）
  4. $（'＃chooseScan'）。addClass（'hide'）;（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-08T17:38:35.623 に答える