Javascript 如何在刷新页面后保持同一选项卡处于打开状态
我是jquery和bootstrap的初学者,所以请原谅我的错误。我已经为用户配置文件设置页面创建了3个带引导的选项卡。我有三个标签个人资料,安全,帐户。在每个选项卡上,都有一个带有一些输入的表单。问题出现在第二个安全选项卡中。用户可以更新他们的密码,所以我使用PHP头函数来重置表单。但是当我重新加载页面时,页面会重定向到profile选项卡,而不是security选项卡。我已经检查了一些已经提出的问题。但是悲伤;他们没有一个为我工作 Javascript代码:Javascript 如何在刷新页面后保持同一选项卡处于打开状态,javascript,php,bootstrap-4,Javascript,Php,Bootstrap 4,我是jquery和bootstrap的初学者,所以请原谅我的错误。我已经为用户配置文件设置页面创建了3个带引导的选项卡。我有三个标签个人资料,安全,帐户。在每个选项卡上,都有一个带有一些输入的表单。问题出现在第二个安全选项卡中。用户可以更新他们的密码,所以我使用PHP头函数来重置表单。但是当我重新加载页面时,页面会重定向到profile选项卡,而不是security选项卡。我已经检查了一些已经提出的问题。但是悲伤;他们没有一个为我工作 Javascript代码: var url = docume
var url = document.location.toString();
if (url.match('#')) {
$('.setting-tabs a[href="#' + url.split('#')[1] + '"]').show('tab');
}
$('.setting-tabs a').on('click', function (e) {
window.location.hash = e.target.hash;
})
此外,我也尝试过:
$('#settingsTab a').click(function(e) {
e.preventDefault();
$(this).tab('show');
});
$("div.setting-tabs > a").on("shown.bs.tab", function(e) {
var id = $(e.target).attr("href").substr(1);
window.location.hash = id;
});
var hash = window.location.hash;
$('#settingsTab a[href="' + hash + '"]').tab('show');
这是我的编辑账户.php
<div id="settingsTab" class="list-group setting-tabs">
<a href="edit_account.php#profile" class="list-group-item active" data-target="#profile" data-toggle="tab"><span aria-hidden="true">Profile</span></a>
<a href="edit_account.php#security" class="list-group-item" data-target="#security" data-toggle="tab"><span aria-hidden="true">Security</span></a>
<a href="edit_account.php#account" class="list-group-item" data-target="#account" data-toggle="tab"><span aria-hidden="true">Account</span></a>
<div class="mb-4"></div>
</div>
<div id="profile" class="tab-pane fade active show">
<h3 style="font-weight: 400;">Need to update your profile?</h3>
<hr class="mb-4">
<form action="" method="post" autocomplete="off">
<div class="row mb-3">
<div class="col-lg-3">
<div class="form-group">
<label class="label-profile">EMAIL</label>
</div>
</div>
<div class="col-lg-6">
<div class="form-group">
<?php
$user_id = $_SESSION['userId'];
$sql = "SELECT * FROM users WHERE user_id = ?";
$stmt = mysqli_stmt_init($connection);
if (!mysqli_stmt_prepare($stmt, $sql)) {
echo "Query Failed";
} else {
mysqli_stmt_bind_param($stmt, "i", $user_id);
mysqli_stmt_execute($stmt);
$result = mysqli_stmt_get_result($stmt);
while ($row = mysqli_fetch_array($result)) {
$usermail = $row['email'];
echo "<input class='form-control' name='email' value='{$usermail}' type='email'>";
}
}
?>
</div>
</div>
<div class="col-lg-3">
<div class="form-group">
<input type="submit" name="email-update" value="Update" class="btn btn-outline-primary float-right">
</div>
</div>
</form>
</div>
<div class="row mb-3">
<div class="col-lg-3">
<div class="form-group">
<label class="label-profile">PHONE</label>
</div>
</div>
<div class="col-lg-6">
<div class="form-group">
<p>Your phone is verified with Bitcoinerrs. Click Edit to change your phone number</p>
</div>
</div>
<div class="col-lg-3">
<div class="form-group">
<a href="phone_verify" class="btn btn-outline-primary float-right">Edit</a>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-3">
<div class="form-group">
<label class="label-profile">IDENTITY</label>
</div>
</div>
<div class="col-lg-6">
<div class="form-group">
<p>Your identity is not verified. Click Verify to verify your identity</p>
</div>
</div>
<div class="col-lg-3">
<div class="form-group">
<a href="identity_verify" class="btn btn-outline-primary float-right">Verify</a>
</div>
</div>
</div>
</div>
<div id="security" class="tab-pane fade">
<h3 style="font-weight: 400;">CHANGE PASSWORD</h3>
<hr class="mb-4">
<form action="" method="post" autocomplete="off">
<?php
if (isset($_POST['update-pass'])) {
$currentPass = escape($_POST['currentPass']);
$passwordNew = escape($_POST['passwordNew']);
$passwordRepeat = escape($_POST['passwordRepeat']);
if (empty($currentPass) || empty($passwordNew) || empty($passwordRepeat)) {
header("Location: edit_account.php?error=emptyfields");
exit();
} elseif (strlen($passwordNew) <= '8') {
header("Location: edit_account.php?error=passwordcheck");
exit();
} elseif ($passwordNew !== $passwordRepeat) {
header("Location: edit_account.php?error=passwordverify");
exit();
} else {
$sql = "SELECT password FROM users WHERE user_id = ?";
$stmt = mysqli_stmt_init($connection);
if (!mysqli_stmt_prepare($stmt, $sql)) {
header("Location: edit_account.php?error=sqlerror");
exit();
} else {
mysqli_stmt_bind_param($stmt, "i", $user_id);
mysqli_stmt_execute($stmt);
mysqli_stmt_store_result($stmt);
$resultCheck = mysqli_stmt_num_rows($stmt);
if (!$resultCheck > 0) {
header("Location: edit_account.php?error=invalidpass");
exit();
} else {
$sql = "UPDATE users SET password = ? WHERE user_id = ?";
$stmt = mysqli_stmt_init($connection);
if (!mysqli_stmt_prepare($stmt, $sql)) {
header("Location: edit_account.php?error=sqlerror2");
exit();
} else {
$hashed_password = password_hash($passwordNew, PASSWORD_DEFAULT);
mysqli_stmt_bind_param($stmt, "si", $hashed_password, $user_id);
mysqli_stmt_execute($stmt);
header("Location: edit_account.php?passupdate=success");
exit();
}
}
}
}
mysqli_stmt_close($stmt);
mysqli_close($connection);
}
?>
<div class="row mb-3">
<div class="col-lg-4">
<div class="form-group">
<label class="label-profile">Current Password</label>
</div>
</div>
<div class="col-lg-8">
<div class="form-group">
<input class="form-control" name="currentPass" type="password">
</div>
</div>
</div>
<div class="row mb-3">
<div class="col-lg-4">
<div class="form-group">
<label class="label-profile">New Password</label>
</div>
</div>
<div class="col-lg-8">
<div class="form-group">
<input class="form-control" name="passwordNew" type="password">
</div>
</div>
</div>
<div class="row">
<div class="col-lg-4">
<div class="form-group">
<label class="label-profile">Confirm Password</label>
</div>
</div>
<div class="col-lg-8">
<div class="form-group">
<input class="form-control" name="passwordRepeat" type="password">
<p class="mt-3">8 characters or longer. Combine upper and lowercase letters and numbers.</p>
</div>
</div>
</div>
<div class="form-group mb-5">
<input type="submit" name="update-pass" value="Save Changes" class="btn btn-primary float-right">
</div>
</form>
<hr class="my-5">
<div class="row">
<div class="col-lg-4">
<div class="form-group">
<label class="label-profile">TWO FACTOR AUTHENTICATION</label>
</div>
</div>
<div class="col-lg-6">
<div class="form-group">
<p>To help keep your account secure, we'll submit a code when using a new device to log in. We'll send the code via email.</p>
</div>
</div>
<div class="col-lg-2">
<div class="form-group">
<input type="checkbox" checked data-toggle="toggle">
</div>
</div>
</div>
</div>
需要更新您的个人资料吗?
电子邮件
这个问题的答案应该有助于@paddyfields我正在使用bootstrap4@paddyfields我也尝试过这个答案。但它不起作用这个问题的答案应该对@paddyfields有帮助我正在使用bootstrap4@paddyfields我也尝试过这个答案。但它不起作用