Question

是否可以动态更改此HTML中的排序？

<li><a href="#step-4">
  <label class="stepNumber">4</label>
  <span class="stepDesc">
     Finish<br />
     <small>LAST STEP</small>
  </span>                   
</a></li>

我有一个id为'finish'的按钮，点击后会通过ajax提交一些数据。完成后，我想改变上面的话：

完成应该完成最后一步应该完成。

我能做到这一点吗？

由于

$('#finish').click(function() {

});

Answer 1

你的ajax成功如下：

$('#finish').click(function() {
    $.ajax({
         ...
         ...
         success:function(data)
         {
             $('span.stepDesc').text('Finished');
             $('span.stepDesc small').text('Completed');

         }
     });
});

Answer 2

试试这个：

＆＃13;

$(document).ready(function() {
   $('#finish').on('click',function(event) {
       $('.stepDesc')[0].innerHTML = 'Finished<br /><small>COMPLETED</small>'
   });
})

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<li><a href="#step-4">
  <label class="stepNumber">4</label>
  <span class="stepDesc">
     Finish<br />
     <small>LAST STEP</small>
  </span>                   
</a></li>

<button id="finish">Finish</button>

＆＃13;

仅供将来参考。如果只是为了更改文字，请使用text()而不是innerHTML。因此，与我的相比，使用text()的任何其他答案可能性能更好，但我会让我留在这里以实现多样化。

Answer 3

我想你可以使用：

＆＃13;

$("#finish").click(function() {
 $("#step").text("COMPLETED");
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<button id="finish"> Finish </button>
<li><a href="#step-4">
  <label class="stepNumber">4</label>
  <span class="stepDesc">
     Finish<br />
     <small id="step">LAST STEP</small>
  </span>                   
  </a></li>

＆＃13;

Answer 4

将text更改为finished，然后附加small标记。这会有所帮助 -

$('#finish').click(function() {
   $('span.stepDesc').text('Finished').append('<br><small>Completed</small>');
});

Answer 5

$('#finish').click(function() {
  $('.stepNumber .stepDesc').html('Finished<br/><small>completed</small>');
});

希望这有效..

Answer 6

你在尝试吗？

$('#finish').click(function() {
   $('.stepDesc small').text('Completed')
});

Answer 7

$('#finish').click(function() {
$('.stepDesc').html('Finished<br /><small>COMPLETED</small>')
});

动态更改文本

7 个答案: