功能attr在jquery不起作用

Question

我使用jQuery来更改我的按钮的值和id，但它不工作时，我做console.log，它显示我的旧值。 我向你解释我在做什么： 我有按钮，他会做一些东西，但我想改变这个按钮的值做一个其他的工作，所以我用attr来改变id，但它不工作。 任何一个可以帮助我，请 这里是我的代码

$('document').ready(function() { 
 
    $('div').hide(); 
 
    
 
    $('#changer').click(function() { 
 
    $('div').show(); 
 
    }); 
 
    
 
    $('#changerText').click(function() { 
 
    x = $("#t").val(); 
 
    $('p').html(x); 
 
    console.log($("#changerText").attr("id")); 
 
    }); 
 
    
 
    $("#ajouter").click(function() { 
 
    $('#t1').html('contenu à ajouter '); 
 
    $('#changerText').val('ajouter').attr('id', 'AjoutT'); 
 
    }); 
 
    
 
    $('#AjoutT').click(function() { 
 
    alert('k'); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<h1>ds Technologies web</h1> 
 
<p>Contenu de la Div</p> 
 
<input type="button" value="changer le contenu de la DIV" id="changer"> 
 
<input type="button" value="ajouter le contenu de la DIV" id="ajouter"><br> 
 
<label>nouvelle Couleur du fond pour la Div</label> 
 
<input type="text"><input type="button" value="valider" id="valider"><br> 
 
<label>les effets viusuelle de jquery:</label><br> 
 
<input type="radio" name="radio"> cacher:<b>Hide</b> 
 
<input type="radio" name="radio"> afficher:<b>show</b> 
 
<br> 
 
<input type="radio" name="radio"> cacher lentement:<b>FadeOut</b> 
 
<input type="radio" name="radio"> Afficher lentement:<b>FadeIn</b><br> 
 
<input type="button" value="appliquer" id="appliquer"> 
 
<div> 
 
    <h1 id='t1'>contenu à changer</h1> 
 
    <label>text à ajouter</label> 
 
    <textarea id="t"></textarea> 
 
    <br> 
 
    <input type="button" value="changer" id="changerText"> 
 

 

 
</div>

Answer 1

请试试这个：

小提琴：https://jsfiddle.net/yv951oLn/

代码：

$("#ajouter").click(function() { 
    var changerText = $('#changerText'); 
    $('#t1').html('contenu à ajouter '); 
    changerText.val('ajouter'); 
    changerText.attr('id', 'AjoutT'); 
    console.log($("#AjoutT").attr("id")); 
    });