为了账号安全,请及时绑定邮箱和手机立即绑定

Bootstrap3.3.5官网文档中 按钮的加载状态的代码 与本节代码不一样,但官网的代码 点击按钮无反应,是哪里出错了?

官网代码:

<button type="button" id="myButton" data-loading-text="Loading..." class="btn btn-primary" autocomplete="off">

  Loading state

</button>


<script>

  $('#myButton').on('click', function () {

    var $btn = $(this).button('loading')

    // business logic...

    $btn.button('reset')

  })

</script>

测试代码:

<!DOCTYPE HTML>

<html>

<head>

<meta charset="utf-8">

<title>按钮插件--按钮加载状态</title>

<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">

<style>

    body{padding:10px;margin:10px;}

</style>

</head>

<body>

    <button type="button" id="myButton" data-loading-text="Loading..." class="btn btn-primary" autocomplete="off"> Loading state </button> 

  <script src="//cdn.bootcss.com/jquery/1.11.3/jquery.min.js"></script>

  <script src="//cdn.bootcss.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>

<script> 

  $(#myButton).on('click', function () {     

    var $btn = $(this).button('loading')        

  $btn.button('reset')   }) 

</script>

</body>

</html>


正在回答

1 回答

$(function(){
    //这里#myButton 要加引号
    $('#myButton').on('click', function () {
        //这里只能写 loading  不能写 loadding
        var $btn = $(this).button('loading');
        //这里加一个定时是为了看效果,不然的话上面设成loading然后下面代码会立刻执行,所以就看不到变化
        setTimeout(function(){
            $btn.button('reset');
        },2000);
    })
})


0 回复 有任何疑惑可以回复我~
#1

我必win 提问者

非常感谢!
2016-01-09 回复 有任何疑惑可以回复我~
#2

陈小晓

请问点击按钮文字变成加载中后,怎么是鼠标禁用? $(function(){ $("#myButton").on('click',function(){ var $btn = $(this).button('loading'); $(this).css('cursor','not-allowed'); setTimeout(function(){ $btn.button('reset'); $(this).css('cursor','default'); },2000); }); });
2016-08-23 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消

Bootstrap3.3.5官网文档中 按钮的加载状态的代码 与本节代码不一样,但官网的代码 点击按钮无反应,是哪里出错了?

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信