jquery - 切换按钮 Jquery 的值

Question

我想使用 jquery 切换功能来切换按钮的值，但它不起作用

我的按钮如下：

<input type="button" value="Click to send message"  id="send_message_button">

现在我想用jquery切换点击发送消息到点击隐藏消息，这可能吗？

Answer 1

如果您的意思是切换，就像您再次单击它时它会恢复一样。尝试这个：

var clicked = false;
$('#send_message_button').click(function(){
    $(this).val("Click to "+ (clicked? "send": "hide") + " message");
    clicked = !clicked;
});

Answer 2

我认为切换功能有点棘手。我为您创建了一个小提琴，请检查。

http://jsfiddle.net/8udzL/

$(document).ready(function () {
$('#send_message_button').click(function () {

    if ($('#send_message_button').val() == "Click to send message") {
        $('#send_message_button').val("Click to hide message");
    } 
    else
    {
    $('#send_message_button').val("Click to send message");
    }
});

});

Answer 3

<input type="button" value="Click to send message" OnClick="toggle()"  id="send_message_button">

function toggle(){
    $('#send_message_button').val("Click to hide message");  
}

Answer 4

你好试试这个：http: //jsfiddle.net/zander_pope/udu5cchh/

$(function () {
    $('.button').on('click', function (e) {
        if (!$('.dd').val()) {
            $('.dd').val("relevance");
        } else {
            $('.dd').val("");
        }
    });
});
$(function () {
    $('.button').on('click', function (e) {
        $('.search').click();
    });
});

这将起作用并且可以适应您的代码。

Answer 5

请看一下http://jsfiddle.net/QcUtc/

<input type="button" value="Click to send message"  id="send_message_button">

$('#send_message_button').click(function(){
    $(this).val("Click to hide message");  
});

Answer 6

我不确定这是否是一个很好的解决方案，但将其作为案例之一阅读。 提琴手

添加数据属性：

<input type="button" value="Click to send message" data-value="Click to hide message"  id="send_message_button" />

js代码：

$('#send_message_button').on('click', function(){
    $(this).val((function(input) {var alt = $(input).data('value'); $(input).data('value', $(input).val()); return alt;})(this))  
});