Javascript 在php中保存mysql数据库中的数据后，如何在按钮点击中切换选项卡？
我是PHP新手，我开始使用PHP开发应用程序，请查看我的代码 index.phpJavascript 在php中保存mysql数据库中的数据后，如何在按钮点击中切换选项卡？,javascript,php,jquery,mysql,Javascript,Php,Jquery,Mysql,我是PHP新手，我开始使用PHP开发应用程序，请查看我的代码 index.php <?php require_once('./config.php'); ?> <?php /* * Following code will get single product details * A product is identified by product id (pid) */ // array for JSON response $response = array(); //
<?php require_once('./config.php'); ?>
<?php
/*
* Following code will get single product details
* A product is identified by product id (pid)
*/
// array for JSON response
$response = array();
// check for required fields
if (isset($_POST['name'])) {
$title = $_POST['name'];
$company = $_POST['company'];
require_once('./db_connect.php');
// connecting to db
$db = new DB_CONNECT();
// mysql inserting a new row
$result = mysql_query("INSERT INTO user(name,company) VALUES('$title','$company')");
}
?>
<html>
<head>
<link type="text/css" rel="Stylesheet" href="style.css" />
<script type="text/javascript" src="jquery-1.7.2.js"></script>
<script type="text/javascript">
$(window).load(function () {
var tabContents = $(".tab_content").hide(),
tabs = $("ul.tabs li");
tabs.first().addClass("active").show();
tabContents.first().show();
tabs.click(function() {
var $this = $(this),
activeTab = $this.find('a').attr('href');
if(!$this.hasClass('active')){
$this.addClass('active').siblings().removeClass('active');
tabContents.hide().filter(activeTab).fadeIn();
}
return false;
});
$(".tabbutton").click(function () {
var nextTab = parseInt($("li.active").attr("id"), 10) + 1;
if (nextTab === 4) { nextTab = 1; }
tabs.removeClass("active");
$("#" + nextTab).addClass("active");
tabContents.hide();
$("#tab" + nextTab).fadeIn("slow");
});
});
</script>
<script type="text/javascript" src="https://js.stripe.com/v1/"></script>
<!-- jQuery is used only for this example; it isn't required to use Stripe -->
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script type="text/javascript">
// this identifies your website in the createToken call below
Stripe.setPublishableKey("<?php echo $stripe['publishable_key']; ?>");
function stripeResponseHandler(status, response) {
if (response.error) {
// re-enable the submit button
$('.submit-button').removeAttr("disabled");
// show the errors on the form
$(".payment-errors").html(response.error.message);
} else {
var form$ = $("#payment-form");
// token contains id, last4, and card type
var token = response['id'];
// insert the token into the form so it gets submitted to the server
form$.append("<input type='hidden' name='stripeToken' value='" + token + "' />");
// and submit
form$.get(0).submit();
}
}
$(document).ready(function() {
$("#payment-form").submit(function(event) {
// disable the submit button to prevent repeated clicks
$('.submit-button').attr("disabled", "disabled");
// createToken returns immediately - the supplied callback submits the form if there are no errors
Stripe.createToken({
number: $('.card-number').val(),
cvc: $('.card-cvc').val(),
exp_month: $('.card-expiry-month').val(),
exp_year: $('.card-expiry-year').val()
}, stripeResponseHandler);
return false; // submit from callback
});
});
尝试此方法，将解决您的问题：
<html>
<head>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script type="text/javascript">
$(window).load(function() {
$(".tab_content").hide();
tabs = $("ul.tabs li");
tabs.first().addClass("active").show();
$(".tab_content").first().show();
tabs.click(function() {
var $this = $(this), activeTab = $this.find('a').attr('href');
if (!$this.hasClass('active')) {
$this.addClass('active').siblings().removeClass('active');
$(".tab_content").hide().filter(activeTab).fadeIn();
}
return false;
});
$("#tabbutton").click(function() {
$("#2").addClass('active').siblings().removeClass('active');
$(".tab_content").hide();
$("#tab2").fadeIn();
});
});
</script>
</head>
<body>
<ul class="tabs clearfix">
<li id="1"><a href="#tab1">Tab1</a></li>
<li id="2"><a href="#tab2">Tab2</a></li>
<li id="3"><a href="#tab3">Tab3</a></li>
</ul>
<div class="tab_container">
<div id="tab1" class="tab_content">
<p>Tab 1 Content Goes Here...</p>
<input type="button" id="tabbutton"/>
</div>
<div id="tab2" class="tab_content">
<p>Tab 2 Content Goes Here...</p>
</div>
<div id="tab3" class="tab_content">
<p>Tab 3 Content Goes Here...</p>
</div>
</div>
</body>
</html>
其次，您的tab3div
与tab1具有相同的id。我认为这是造成问题的原因。
将其更改为tab3并尝试
<div id="tab1" class="tab_content">
<p>Tab 3 Content Goes Here...</p>
</div>
表3内容如下所示
hi@ahsan我按照你的建议做了，但运气不好。我为tabbutton click添加了新的逻辑。试试这个。嗨，阿桑，我尝试了新的逻辑，但它给了我同样的结果。不走运。我已经为您编辑了答案并提供了工作示例。使用相同的方法。嗨，ahsan，我尝试了你的方法，现在选项卡正在从一个选项卡切换到另一个选项卡，但数据没有插入到数据库中，当我更改输入类型=按钮以提交时，相反的方法正在起作用。例：在这种情况下，数据插入工作，在这种情况下，制表符开关工作。
<div id="tab2" class="tab_content">
<form id="payment-form" action="charge.php" method="post">
<h3>Purchase a quote by Oscar Wilde today! Only $535! Limited supply and going fast, buy now!!</h3>
<!-- to display errors returned by createToken -->
<span class="payment-errors"></span>
<form action="charge.php" method="POST" id="payment-form">
<div class="form-row">
<label>Card Number</label>
<input type="text" size="20" autocomplete="off" class="card-number" />
</div>
<div class="form-row">
<label>CVC</label>
<input type="text" size="4" autocomplete="off" class="card-cvc" />
</div>
<div class="form-row">
<label>Expiration (MM/YYYY)</label>
<input type="text" size="2" class="card-expiry-month"/>
<span> / </span>
<input type="text" size="4" class="card-expiry-year"/>
</div>
<button type="submit" class="submit-button">Buy!</button>
</form>
</form>
</div>
<div id="tab1" class="tab_content">
<p>Tab 3 Content Goes Here...</p>
</div>