Javascript 如何在每次单击按钮时更改其文本值？_Javascript_Jquery_Html

Javascript 如何在每次单击按钮时更改其文本值？

javascript jquery html

Javascript 如何在每次单击按钮时更改其文本值？,javascript,jquery,html,Javascript,Jquery,Html,下面是jquery代码和表。jquery代码是在每次单击reply按钮时切换名为“divrep”的div元素。我想要的是我想要回复按钮在每次单击时更改文本值。因此，最初，按钮的文本值是“Replie（s）”。我想在单击时将其更改为“隐藏回复”，再次单击时将其更改为“回复”。如何在我的代码中添加脚本来执行此操作？谢谢 Jquery: $(function () { $('.Reply').click(function () { $(this).closest('p').next('.di

下面是jquery代码和表。jquery代码是在每次单击reply按钮时切换名为“divrep”的div元素。我想要的是我想要回复按钮在每次单击时更改文本值。因此，最初，按钮的文本值是“Replie（s）”。我想在单击时将其更改为“隐藏回复”，再次单击时将其更改为“回复”。如何在我的代码中添加脚本来执行此操作？谢谢

Jquery:

$(function () {
  $('.Reply').click(function () {
  $(this).closest('p').next('.divrep').toggle(!$(this).closest('p').next('.divrep').is(":visible"));
   // How to insert a code here to change the text value of the reply button in every click?
 });
});

<table id="mytable">  

    <tr >
        <td class="tdstyle" >

  <div style="font-weight:bold;">  @Html.DisplayFor(modelItem => item.name) </div> 

   <p class="comment more" style ="white-space: pre-line; margin-top:0px;margin-bottom:0px; border-radius: 4px 4px 4px 4px; max-width :500px; min-height :5px;  display :block; background-color: #CCCCFF">  @Html.DisplayFor(modelItem => item.comment) </p>
  <p> <input type="button" id="like" name="like" value="Like" style="color:blue;border:0px;background-color:inherit;cursor:pointer" /> <input type="button" class ="Reply" name="Reply" value="Replie(s)"  style="margin-bottom:0px;color:blue;border:0px;background-color:inherit;cursor:pointer" /></p>                                                                                                                                 
   <div id="divReply" class ="divrep" style="display:none; position:relative;left:50px; overflow:auto;margin-top:0px;margin-bottom:0px">
           <table>

                 <tr >

                     <td >
                         <div style="font-weight:bold;"> @Html.DisplayFor(modelItem => item2.name) </div> 

                     <p class="comment more" style ="margin-top:0px;margin-bottom:0px;white-space:pre-line; border-radius: 4px 4px 4px 4px; max-width :445px; min-height :5px;  display :block; background-color: #CCCCFF;">@Html.DisplayFor(modelItem => item2.reply)  </p>

                   </td>
                 </tr>

            </table>      

   <div> 
       <div class="editor-field" style="display:none; margin-bottom:5px;margin-top:5px">  
          <input type="text" id="comidvalue" name="id" class="id" value="@Html.DisplayFor(modelItem => item.Id)" />
       </div>

       <br />
       <input type="text" id="namerep" name="name" class="name" style="width:445px;resize:none" />

      <br />
      <textarea id="reply" name="reply" class="reply" style="width:445px;height:100px;resize:none" ></textarea>

         <br />

       <input type="button" class="postrep" value="Post Reply" name="butname" style="cursor:pointer" /> 

     </div>
            <br />

  </div>
        </td>       
    </tr>


</table>

HTML:

$(function () {
  $('.Reply').click(function () {
  $(this).closest('p').next('.divrep').toggle(!$(this).closest('p').next('.divrep').is(":visible"));
   // How to insert a code here to change the text value of the reply button in every click?
 });
});

<table id="mytable">  

    <tr >
        <td class="tdstyle" >

  <div style="font-weight:bold;">  @Html.DisplayFor(modelItem => item.name) </div> 

   <p class="comment more" style ="white-space: pre-line; margin-top:0px;margin-bottom:0px; border-radius: 4px 4px 4px 4px; max-width :500px; min-height :5px;  display :block; background-color: #CCCCFF">  @Html.DisplayFor(modelItem => item.comment) </p>
  <p> <input type="button" id="like" name="like" value="Like" style="color:blue;border:0px;background-color:inherit;cursor:pointer" /> <input type="button" class ="Reply" name="Reply" value="Replie(s)"  style="margin-bottom:0px;color:blue;border:0px;background-color:inherit;cursor:pointer" /></p>                                                                                                                                 
   <div id="divReply" class ="divrep" style="display:none; position:relative;left:50px; overflow:auto;margin-top:0px;margin-bottom:0px">
           <table>

                 <tr >

                     <td >
                         <div style="font-weight:bold;"> @Html.DisplayFor(modelItem => item2.name) </div> 

                     <p class="comment more" style ="margin-top:0px;margin-bottom:0px;white-space:pre-line; border-radius: 4px 4px 4px 4px; max-width :445px; min-height :5px;  display :block; background-color: #CCCCFF;">@Html.DisplayFor(modelItem => item2.reply)  </p>

                   </td>
                 </tr>

            </table>      

   <div> 
       <div class="editor-field" style="display:none; margin-bottom:5px;margin-top:5px">  
          <input type="text" id="comidvalue" name="id" class="id" value="@Html.DisplayFor(modelItem => item.Id)" />
       </div>

       <br />
       <input type="text" id="namerep" name="name" class="name" style="width:445px;resize:none" />

      <br />
      <textarea id="reply" name="reply" class="reply" style="width:445px;height:100px;resize:none" ></textarea>

         <br />

       <input type="button" class="postrep" value="Post Reply" name="butname" style="cursor:pointer" /> 

     </div>
            <br />

  </div>
        </td>       
    </tr>


</table>


@DisplayFor（modelItem=>item.name）
@Html.DisplayFor（modelItem=>item.comment）

@DisplayFor（modeleItem=>item2.name）
@Html.DisplayFor（modelItem=>item2.reply）

您可以尝试使用divrep的可见性状态设置文本值

$（函数（）{
$（'.Reply'）。单击（函数（）{
var$divrep=$（this.nexist（'p'）。next（'.divrep'）。toggle（！$（this.nexist（'p'））。next（'.divrep'）。是（“：可见”）；
$（this.val（$divrep.is（‘：可见’）？‘隐藏回复’：‘回复’）
});
});

@DisplayFor（modelItem=>item.name）
@Html.DisplayFor（modelItem=>item.comment）

@DisplayFor（modeleItem=>item2.name）
@Html.DisplayFor（modelItem=>item2.reply）








您可以尝试使用divrep的可见性状态设置文本值

$（函数（）{
$（'.Reply'）。单击（函数（）{
var$divrep=$（this.nexist（'p'）。next（'.divrep'）。toggle（！$（this.nexist（'p'））。next（'.divrep'）。是（“：可见”）；
$（this.val（$divrep.is（‘：可见’）？‘隐藏回复’：‘回复’）
});
});

@DisplayFor（modelItem=>item.name）
@Html.DisplayFor（modelItem=>item.comment）

@DisplayFor（modeleItem=>item2.name）
@Html.DisplayFor（modelItem=>item2.reply）








您可以尝试使用divrep的可见性状态设置文本值

$（函数（）{
$（'.Reply'）。单击（函数（）{
var$divrep=$（this.nexist（'p'）。next（'.divrep'）。toggle（！$（this.nexist（'p'））。next（'.divrep'）。是（“：可见”）；
$（this.val（$divrep.is（‘：可见’）？‘隐藏回复’：‘回复’）
});
});