Jquery入力属性のパスワードをテキストに変更

Question

私はjQueryの初心者です。私は一週間の問題を解決するためにあなたの助けが必要です。 私は下の図のように（ログイン、パスワード、ボタン）のテーブルを持っています。 隠しパスワードを5秒間表示してからもう一度非表示にし、ボタンがクリックされた行のみを表示します。 問題： - 1つのボタンをクリックすると、すべてが正常です。 - 別のボタンをクリックすると、最初のパスワードも表示されます。ここで

\t $(document).ready(function() { 
 
\t //-------------------------------------- 
 
\t $("table input[type='button']").on("click",function() { 
 
\t var element_td = $(this).parent('td'); 
 
\t var element_tr = element_td.parent('tr'); \t 
 
\t var element_input = element_tr.find("input[type='password']"); 
 
\t $("#form-inner").show(); 
 
\t //-------------------------------------- 
 
\t function truePswd(password) { 
 
\t \t var password = $('#password').val(); 
 
\t \t if (password == '') { 
 
\t \t alert ("Empty password"); 
 
\t \t return false; 
 
\t \t } 
 
\t \t else 
 
\t \t { 
 
\t \t return true; 
 
\t \t } 
 
\t } 
 
\t $("#ok").on("click",function() { 
 

 
\t //---------------------------------------- 
 
\t var result =truePswd (password); 
 
    if (result == true) { 
 
\t \t var password = $('#password').val(); 
 
\t \t $.ajax ({ 
 
\t \t type : 'POST', 
 
\t \t cache : 'false', 
 
\t \t url : 'process.php', 
 
\t \t data : 'password ='+password, 
 
\t \t success : function(data) { 
 
\t \t $("#form-inner").hide(); 
 

 
\t \t if(data = 'ok') { 
 

 
\t \t element_input.addClass('evidence'); 
 
\t \t element_input.attr('type', 'text'); \t 
 
\t \t 
 
\t //----------------------------------------- 
 
\t \t setTimeout(function() { 
 
\t \t element_input.removeClass('evidence'); 
 
\t \t element_input.attr('type', 'password'); \t 
 
\t \t \t 
 
\t \t }, 
 
\t \t 10000 
 
\t \t); 
 
\t //----------------------------------------- 
 
\t \t } 
 
\t \t }, 
 
\t \t error : function() { 
 
\t \t alert("Error Ajax request"); 
 
\t \t } 
 
\t \t }); 
 
\t \t } 
 
\t }); 
 
\t }); 
 

 
\t //------------------------------------------ 
 
\t });

\t \t <table> 
 
\t \t \t <thead> 
 
\t \t \t <tr> 
 
\t \t \t \t <td>login</td> 
 
\t \t \t \t <td>password</td> 
 
\t \t \t \t <td>action</td> 
 
\t \t \t </tr> 
 
\t \t \t </thead> 
 
\t \t \t <tbody> 
 
\t \t \t <tr id="1"> 
 
\t \t \t \t <td>admin</td> 
 
\t \t \t \t <td> 
 
\t \t \t \t \t <input type="password" value="n1mD@_!21&$"/> 
 
\t \t \t \t </td> 
 
\t \t \t \t <td> 
 
\t \t \t \t \t <input type="button" value="show password"/> 
 
\t \t \t \t </td> 
 
\t \t \t </tr> 
 
\t \t \t <tr id="2"> 
 
\t \t \t \t <td>lynxus</td> 
 
\t \t \t \t <td> 
 
\t \t \t \t \t <input type="password" value="l1ncSU$"/> 
 
\t \t \t \t </td> 
 
\t \t \t \t <td> 
 
\t \t \t \t \t <input type="button" value="show password"/> 
 
\t \t \t \t </td> 
 
\t \t \t </tr> 
 
\t \t \t <tr id="3"> 
 
\t \t \t \t <td>zeus76</td> 
 
\t \t \t \t <td> 
 
\t \t \t \t \t <input type="password" value="d1L&m@4_714"/> 
 
\t \t \t \t </td> 
 
\t \t \t \t <td> 
 
\t \t \t \t \t <input type="button" value="show password"/> 
 
\t \t \t \t </td> 
 
\t \t \t </tr> 
 
\t \t \t </tbody> 
 
\t \t </table>

enter image description here

Answer 1

..私は、これはあなたが探しているものであると思いますこれを試して...

ここにあなたが確認するためのフィドルです：https://jsfiddle.net/sgvwume3/1/

ここにはのJqueryコード：

$('.btn').click(function(){ 
    var $this = $(this); 
    $parent = $this.parent().parent(); 
    $td = $parent.find('td:eq(1)'); 
    sample($this, $td); 

}) 

function sample($this, $input){ 
    var input = $input; 
    $this.promise(
    input.find('.inputClass').attr('type', 'text') 
).done(function(){ 
    setTimeout(function(){ 
    input.find('.inputClass').attr('type', 'password'); 
    }, 3000); 
    }); 
}