Question

我在html中有一个按钮

<input id="LockUnlock"
       type="submit" 
       class="btn-sm btn-primary" 
       value="@(agent.IsLockedOut ? "Unlock" : "Lock")"/>

它根据模型正确设置了值，但我想在点击它时切换按钮文本。

我的Javascript：

<script type="text/javascript">
        $('input[type = submit]').click(function () {
            if ($(this).text() === "Lock") 
            { 
                $(this).text("Unlock"); 
            } 
            else 
            { 
                $(this).text("Lock"); 
            }
        });
    </script>

单击按钮时没有任何反应。我没有在Chrome控制台窗口中看到错误。

Answer 1

使用$(this).val()代替$(this).text()。

另外，我修复了你在问题中遇到的一些代码错误。

 $('input[type=submit]').click(function () {
            if ($(this).val() === "Lock") 
            { 
                $(this).val("Unlock"); 
            } 
            else 
            { 
                $(this).val("Lock"); 
            }; 
        });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="LockUnlock"
       type="submit" 
       class="btn-sm btn-primary" 
       value="Unlock"/>

注意：请查看this post以了解.text()和.val()之间的差异

Answer 2

您可以写下此<input id="LockUnlock" type="submit" class="btn-sm btn-primary" value="@(agent.IsLockedOut ? 'Unlock' : 'Lock')"/>

尝试在javascript中切换按钮上的文本

2 个答案: