Javascript 单击“更改”按钮

在html中，我有一个显示文本的按钮和一个隐藏文本的按钮。每个按钮都有直接指向js中特定函数的“onclick”属性。我想在单击按钮时更改“onclick”值，并更改按钮内的文本（显示/隐藏）。 我无法使用'triggleClass'，因为我需要使用'onclick'属性（它的值已更改，因为我使用的是django） 目前，我有两个按钮用于此操作，我只想将这两个按钮合并为一个按钮。 代码：

Show
隐藏
功能展示（pos）{
$（'#show_text.'+pos）.css（'display'，'block'）；
$（“#我的文字显示+位置）.prop（“已禁用”，true）；
}
功能隐藏（pos）{
$（'#show_text.'+pos）.css（'display'，'none'）；
$（“#我的文字显示+位置）.prop（“禁用”，false）；
}

有人有解决办法吗

谢谢

Show
<btn id="show_btn_{{forloop.counter}}" onclick="ShowHide({{forloop.counter}})" class="btn show_btn">Show</btn>

<script>
function ShowHide(pos){

    if ($('#show_text_'+pos).css('display') !== 'none') { //lets hide
        $('#show_text_'+pos).css('display','none');
        $('#show_btn_'+pos).html("Show");
    } else {
        $('#show_text_'+pos).css('display','block'); 
        $('#show_btn_'+pos).html("Hide");
    }

}

</script>

功能显示隐藏（pos）{
if（$（'#show_text.'+pos）.css（'display'）！='none'）{//let hide
$（'#show_text.'+pos）.css（'display'，'none'）；
$（'#show_btn'+pos）.html（“show”）；
}否则{
$（'#show_text.'+pos）.css（'display'，'block'）；
$（'#show_btn'+pos）.html（“隐藏”）；
}
}

试试这个简短的代码：

函数显示隐藏（id）{
如果（$（id.html（）=“显示”）{
$（id）.html（“隐藏”）；
}否则{
$（id）.html（“显示”）；
}
}

显示

$（文档）.ready（函数（）{
$（'.show_btn'）。单击（函数（）{
if（$（this）.text（）=='Show'）{
$（this.text（'Hide'）；
}
else if（$（this）.text（）=='Hide'）{
$（this.text（'Show'）；
}
});
});

显示
$（文档）.ready（函数（）{
$（'.show_btn'）。单击（函数（）{
var attr=$（this.attr（'data-attr'）；
var text=$（this.text（）；
$（本）.text（attr）；
$（this.attr（'data-attr'，text）；
});
});

<btn id="show_btn_{{forloop.counter}}" onclick="ShowHide({{forloop.counter}})" class="btn show_btn">Show</btn>

<script>
function ShowHide(pos){

    if ($('#show_text_'+pos).css('display') !== 'none') { //lets hide
        $('#show_text_'+pos).css('display','none');
        $('#show_btn_'+pos).html("Show");
    } else {
        $('#show_text_'+pos).css('display','block'); 
        $('#show_btn_'+pos).html("Hide");
    }

}

</script>

<script>

$(document).ready(function(){
   $('.show_btn').click(function(){
    if($(this).text()=='Show'){
        $(this).text('Hide');
     }
     else if($(this).text()=='Hide'){
        $(this).text('Show');
     }
   });
});
</script>

<button  class="btn show_btn" data-attr='Hide'>Show</button>
<script>

$(document).ready(function(){
   $('.show_btn').click(function(){
       var attr =$(this).attr('data-attr');
       var text =$(this).text();
       $(this).text( attr );
       $(this).attr('data-attr', text );
   });
});
</script>