我有一个带有3tabs的页面。我需要让页面重定向到重新加载之前来自的同一选项卡。我要求每个选项卡shuold在URL中添加一个字符串，例如＃menu1＃menu2，但我不会共享我的代码。我是Laravel的新手，不知道如何处理。请引导我解决此问题。感谢您的帮助和建议。
@extends('admin.main')
@section('title') {{ !empty($article) ? 'ویرایش اطلاعات فروشگاه ' : 'ثبت اطلاعات فروشگاه' }} @endsection
@section('content')
<main class="app-content">
<div class="row">
<div class="col-sm-12">
<div class="float-left">
<ol class="breadcrumb float-sm-left">
<li class="breadcrumb-item"><a href="{{ route('dashboard') }}">پنل مدیریت</a></li>
<li class="breadcrumb-item">{{ !empty($article) ? 'ویرایش اطلاعات فروشگاه ' : 'ثبت اطلاعات فروشگاه' }}</li>
</ol>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="tile">
<div class="float-right">
<h3 class="tile-title">{{ !empty($article) ? 'ویرایش اطلاعات فروشگاه ' : 'ثبت اطلاعات فروشگاه' }}</h3>
</div>
<br/>
<hr/>
<nav>
<ul class="nav nav-tabs" id="nav-tab" role="tablist">
<li>
<a class="nav-item nav-link active" id="shop-condition-tab" data-toggle="tab"
href="#shop-condition" role="tab" aria-controls="shop-condition" aria-selected="true">قوانین
خرید</a>
</li>
<li>
<a class="nav-item nav-link" id="order-submit-tab" data-toggle="tab" href="#order-submit"
role="tab" aria-controls="order-submit" aria-selected="false">روشهای ارسال</a>
</li>
<li>
<a class="nav-item nav-link" id="product-coupon-tab" data-toggle="tab"
href="#product-coupon" role="tab" aria-controls="product-coupon" aria-selected="false">تخفیفها</a>
</li>
</ul>
</nav>
<div class="tab-content" id="nav-tabContent">
<div class="tab-pane fade show active" id="shop-condition" role="tabpanel"
aria-labelledby="shop-condition-tab">
<div class="tile-body">
<form action="{{ route('updateProductCondition', 'shop') }}" method="POST"
enctype="multipart/form-data">
@csrf
{{ @method_field('PATCH') }}
<hr class="colorize" style="width: 45%;margin-right: 0px;">
<div class="row">
<div class="col-md-12">
<div class="form-group">
<textarea
class="tinymce withImgUpload {{ $errors->has('spf_product_condition_description') ? ' is-invalid' : '' }}"
rows="12"
name="spf_product_condition_description">{!! old('spf_product_condition_description', $condition)!!}</textarea>
</div>
</div>
</div>
<hr>
<div class="row">
<div class="col-md-6" style="margin-top: 20px">
<div class="form-group">
<button class="btn btn-success storeAjax">ثبت</button>
</div>
</div>
</div>
</form>
</div>
</div>
<div class="tab-pane fade" id="order-submit" role="tabpanel" aria-labelledby="order-submit-tab">
<div class="tile-body">
<form action="{{ route('storeProductSubmit') }}" method="POST"
enctype="multipart/form-data">
@csrf
<hr class="colorize" style="width: 45%;margin-right: 0px;">
<div class="row">
<div class="form-group col">
<span class="text-danger">*</span>
<label for="title" class="control-label">عنوان</label>
<br>
<input type="text" id="title-shop" name="title" class="form-control" value="" autofocus>
</div>
<div class="form-group col">
<span class="text-danger">*</span>
<label for="price" class="control-label">هزینه</label>
<br>
<input type="text" id="price_shop" name="price" class="form-control" value="" autofocus>
</div>
<div class="form-group col">
<span class="text-danger">*</span>
<label for="time_type">واحد زمان رسیدن</label>
<select name="time_type" class="form-control" id="publish_status">
<option value="null">انتخاب کنید</option>
<option value="day">روز</option>
<option value="hour" >ساعت</option>
<option value="week">هفته</option>
</select>
</div>
<div class="form-group col">
<span class="text-danger">*</span>
<label for="time" class="control-label">زمان رسیدن</label>
<input type="number" min="0" id="delivery_time" name="time" class="form-control" value="" autofocus>
</div>
</div>
<div class="row">
<div class="col-md-6" style="margin-top: 10px">
<div class="form-group">
<button class="btn btn-success storeAjax">ثبت</button>
</div>
</div>
</div>
</form>
<hr>
<div class="row">
<div class="col-md-12">
<table class="table table-bordered table-xs">
<thead class="thead-dark">
<tr>
<th>عنوان</th>
<th>هزینه</th>
<th>واحد زمان رسیدن</th>
<th>زمان رسیدن</th>
<th>اقدامات</th>
</tr>
</thead>
<tbody>
@foreach($productSubmits as $productSubmit)
<tr>
<td>{{ $productSubmit->title }}</td>
<td>{{ $productSubmit->price }}</td>
<td>{{ $productSubmit->time_type }}</td>
<td>{{ $productSubmit->time }}</td>
<td>
<div class="d-flex">
<a href="{{ route('editProductSubmit', $productSubmit->id) }}" class="fa fa-pencil text-dark">ویرایش</a>
<form action="{{ route('deleteProductSubmit', $productSubmit->id) }}" method="POST">
@csrf
@method('DELETE')
<button type="submit" class="fa fa-times text-dark mr-2">حذف</button>
</form>
</div>
</td>
</tr>
@endforeach
<td colspan="5" class="text-center">موردی برای نمایش وجود ندارد</td>
</tbody>
</table>
</div>
</div>
</div>
</div>
<div class="tab-pane fade" id="product-coupon" role="tabpanel"
aria-labelledby="product-coupon-tab">
<div class="tile-body">
<form action="{{ route('storeProductCoupon') }}" method="POST"
enctype="multipart/form-data">
@csrf
{{ !empty($article) ? @method_field('PATCH') : '' }}
<hr class="colorize" style="width: 100%;margin-right: 0px;">
<div class="row">
<div class="col-md-12">
<div class="form-group">
//
</div>
</div>
</div>
<hr>
<div class="row">
<div class="col-md-6" style="margin-top: 20px">
<div class="form-group">
<button class="btn btn-success storeAjax">ثبت</button>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
</main>
@endsection
@section('script')
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
@endsection
为此，您需要将标签ID保存在Cookie或浏览器存储中。您使用bootstrap 4选项卡，您可以像bellow.via javascript那样
$('a[data-toggle="tab"]').on('shown.bs.tab', function(event) {
let activeTab = $(event.target), // activated tab
id = activeTab.attr('href'); // active tab href
// set id in html5 localstorage for later usage
localStorage.setItem('activeTab', id);
});
现在，保存在用户浏览器存储中的标签的ID，您可以在页面加载后取回ID。
window.onload = function() {
let tabID = localStorage.getItem('activeTab');
$(tabID).tab('show');
};
有关更多信息，请阅读bootstrap 4选项卡DOC。https://getbootstrap.com/docs/4.0/components/navs/#via-javascript
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句