0

パスワードの表示を切り替えるこの「パスワードを表示」チェックボックスがありますが、正常に機能しますが、パスワードフィールドが空の場合はチェックボックスを無効にし、いつか入力した場合にのみ有効にしたいだけです。

http://jsfiddle.net/aaK9E/2/

var showPass=false;
$('#c').change(function(){
    showPass = ($('#c:checked').length>0);
    if (showPass){
        $('#p').hide();
        $('#t').show();
    }else{
        $('#t').hide();
        $('#p').show();
    }
});

$('#p').change(function(){
    if (!showPass) $('#t').val($('#p').val());
});
$('#t').change(function(){
    if (showPass) $('#p').val($('#t').val());
});

キーアップと変更を試みましたが、ユーザーがいつか書いてから削除した場合、チェックボックスは有効のままになります。

4

4 に答える 4

2

これを試してください：http：//jsfiddle.net/aaK9E/51/

var showPass = false;
$('#c').attr('disabled', 'disabled'); // disabled on doc ready
$('#c').change(function () {
   showPass = ($('#c:checked').length > 0);
   if (showPass) {
       $('#p').hide();
       $('#t').show();
   } else {
       $('#t').hide();
       $('#p').show();
   }
});

$('#p').keypress(function () { // use keypress instead of change
   $('#c').removeAttr('disabled'); // remove the attr 'disabled'
   if (!showPass) $('#t').val($('#p').val());
});
$('#t').change(function () {
  if (showPass) $('#p').val($('#t').val());
});

backspace is doneパスワードフィールドに値がない場合は、これに変更できます。

$('#p').keyup(function () { 
  $('#c').removeAttr('disabled');
  if (!showPass) {
    $('#t').val($('#p').val());
  }
  if ($(this).val() == '') { // this will check the val if there is not
    $('#c').attr('disabled', 'disabled'); it will disable it again.
  }
});

また、lates jqueryが使用されている場合：

$('#p').on('keyup', function () { // this '.on()' requires latest jquery
  $('#c').removeAttr('disabled');
  if (!showPass) {
    $('#t').val($('#p').val());
  }
  if ($(this).val() == '') { // this will check the val if there is not
    $('#c').attr('disabled', 'disabled'); it will disable it again.
  }
});

必要に応じてtry to use latest jquery

于 2013-01-10T16:50:01.950 に答える
1

次のコードを使用します。JSFiddleデモ

状態に関係なく無効になります（つまり、テキストボックスまたはパスワードボックスに入力します）

$('#p, #t').keyup(function(){
  if ($(this).val() != "") {
    Enable();
  }
  else
  {
    Disable();
  }
});

function Enable() {
 $("#c").removeAttr("disabled");
}

function Disable() {
  $("#c").attr("disabled", true);
}
于 2013-01-10T16:51:10.623 に答える
0

キーダウンを使用して、ボックスが空かどうかを確認できます。

$('#p').keydown(function(){
  if( $(this).val() == "" ){
      $('#c').attr("disabled", true);
  }else{
      $('#c').removeAttr("disabled");
  }
});

キーを押すと、テキストボックスが空かどうかがチェックされ、空の場合はチェックボックスが無効になります。次に、if（）{を実行して、初期状態のページ読み込みを確認する必要があります。

于 2013-01-10T16:43:22.847 に答える
0

これを試してみてください:- http://jsfiddle.net/aaK9E/52/ これは、パスワード フィールドが空のときに初めて機能します。

<input type="text" size="50" id="t" />
<input type="password" size="50" id="p" /><br />
<input type="checkbox" id="c" disabled="true">Show Password



var showPass=false;
$('#c').change(function(){
    showPass = ($('#c:checked').length>=0);
    if (showPass){
        $('#p').hide();
        $('#t').show();
    }else{
        $('#t').hide();
        $('#p').show();
    }
});

$('#p').bind("change keyup keypress keydown",function(){
    if (!showPass) $('#t').val($('#p').val());
  if($(this).val()=='')
    $('#c').attr("disabled","true");
  else
    $('#c').removeAttr("disabled");
});
$('#t').bind("change keyup keypress keydown",function(){
    if (showPass) $('#p').val($('#t').val());
    if($(this).val()=='')
    $('#c').attr("disabled","true");
  else
    $('#c').removeAttr("disabled");
});
于 2013-01-10T17:13:02.800 に答える