单击按钮更改切换选项卡 - c#

我使用引导程序创建了3个标签,一切正常。

但是我需要在标签内容中添加一个“下一个按钮”,每当用户单击它时,都会将用户带到下一个标签。如何为该按钮编写脚本,我希望使用asp:button控件
小提琴:http://www.bootply.com/B2JQzjZDZH

javascript:

 $(document).ready(function () {
              $('[data-toggle="btns"] .btn').on('click', function () {
                  var $this = $(this);
                  $this.parent().find('.active').removeClass('active');
                  $this.addClass('active');
              });
          });

HTML:

<div class="btn-group form-group" data-toggle="btns">
   <a class="btn btn-default active" href="#first" data-toggle="tab">step 1</a>
   <a class="btn btn-default" href="#second" data-toggle="tab">step 2</a>
   <a class="btn btn-default" href="#third" data-toggle="tab">step 3</a><br>
                    </div>
<div class="tab-content" runat="server" id="divContent">
<div class="tab-pane active" id="first">
content 1
  <button type="button">next</button>
</div>

<div class="tab-pane" id="second">
content 2
  <button type="button">next</button>
</div>

<div class="tab-pane" id="third">
    content 3
  </div>
</div>

参考方案

通常:您可以通过多种方式激活各个选项卡:

$('#myTab a[href="#profile"]').tab('show') // Select tab by name
$('#myTab a:first').tab('show') // Select first tab
$('#myTab a:last').tab('show') // Select last tab
$('#myTab li:eq(2) a').tab('show') // Select third tab (0-indexed)

来自http://getbootstrap.com/javascript/#tabs

但是,您的HTML并不完全符合Bootstrap的用法。要使这项工作,您应该使用:

<ul class="nav nav-tabs" role="tablist" id="myTab">
  <li class="active"><a href="#home" role="tab" data-toggle="tab">Home</a></li>
  <li><a href="#profile" role="tab" data-toggle="tab">Profile</a></li>
  <li><a href="#messages" role="tab" data-toggle="tab">Messages</a></li>
  <li><a href="#settings" role="tab" data-toggle="tab">Settings</a></li>
</ul>

<div class="tab-content">
  <div class="tab-pane active" id="home">...</div>
  <div class="tab-pane" id="profile">...</div>
  <div class="tab-pane" id="messages">...</div>
  <div class="tab-pane" id="settings">...</div>
</div>

但是,您也可以通过更改选项卡窗格和选项卡本身的活动类来实现。

这是您的示例http://www.bootply.com/q00EhgVnSG

故障排除“警告:session_start():无法发送会话高速缓存限制器-标头已发送” - php

我收到警告:session_start()[function.session-start]:无法发送会话缓存限制器-标头已发送(错误输出开始如果我将表单数据提交到其他文件进行处理,则可以正常工作。但是,如果我将表单数据提交到同一页面,则会出现此错误。请建议<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0…

Div单击与单选按钮相同吗? - php

有没有一种方法可以使div上的click事件与表单环境中的单选按钮相同?我只希望下面的div提交值,单选按钮很丑代码输出如下:<input id="radio-2011-06-08" value="2011-06-08" type="radio" name="radio_date&#…

使用php重新加载内容 - javascript

在对网站进行编程时,我以前使用过此代码,它可以完美工作,但是现在当我想使用一些Flash部件时,每次单击链接时,它都会重新加载所有网站。源代码: <!DOCTYPE html> <html> <head> <title>Hot King Staff</title> <meta charset=…

AJAX调用只能与$(document).on('click')一起使用 - php

我有一个显示数据库条目的表。用户能够为每一行打开一个弹出菜单。选项之一是删除数据库条目,并且该表应通过AJAX调用相应地刷新。只要有人单击#delete-toggle中的table-popup,我就会在HTML页面上进行AJAX调用(table-popup是div,当有人单击每行中存在的表中的table-edit-button时出现的表): <div …

用jQuery填充模式形式 - javascript

我正在将订单表从数据库绘制到datatables(jquery插件)中。我要在每笔最后一笔交易或每笔交易中增加付款。问题是,如何获取单击添加付款按钮以添加付款的行的订单ID。其次,当点击addpayment时,它会弹出一个带有字段或订单号的模态表单。我想用在td中找到的订单ID填充该字段,并使其不可编辑或隐藏,但在提交模态表单时将其发布到服务器。表格和模式表…