如何根据页面重定向显示/隐藏？

Question

screenshot2

screenshot1

我有4个字段，形式

1. 产品字段。
2. 品牌领域。
3. 服务字段。

我想在索引中全部显示它们，但是当我转到产品网址时，我只想显示产品字段和服务字段

我尝试了.show和hide方法，但它隐藏了所有网址的字段

我正在尝试隐藏此方法，现在它按照我的要求隐藏了，但是在表单字段中有所妥协，我不希望有空白。

问题有所不同，现在它解决了我所做的事情，即我创建了一个不同的id并调用了特定的id，而又不影响页边空白和所有内容，并且现在就像魅力一样工作。

<div style="display:none;" class="appointment" id="booking-form-modal" data-backdrop="static" data-keyboard="false">

  <form method="POST" action="/submit-request" onsubmit="submitRequest();">
  <input type="hidden" name="_token" value="{{ csrf_token() }}">

    <div class="row">
      <div class="col-md-12">
        <div class="form-group">
        <select id="productDropdown" class="form-control" name="product" required>
        <option value="">Select Products</option>
        @foreach($products as $product)
        <option value="{{ $product['id']}}">{{ $product['name']}}</option>
        @endforeach

          </select>
        </div>
      </div>
    </div>

      <div  class="row" >
        <div class="col-md-12">
          <div class="form-group">
          <select id="brandDropdown" class="form-control" name="brands" required>
            <option value="">Select Brands</option>
          </select>
          </div>
        </div>
      </div>
    <div class="row">
      <div class="col-md-12">
        <div class="form-group">
        <select id="serviceDropdown" class="form-control" name="services" required>
          <option value="">Select Services</option>
        </select>
        </div>
      </div>
    </div>
  </form>
</div>

根据请求重定向的脚本

    <script type="text/javascript">
 window.addEventListener('load', function() {
    if(/services|1800/.test(window.location.href))
    {
      document.getElementById('brandDropdown').style.display = 'none';
    }
});



</script>

Answer 1

您的网址看起来如何，何时调用提供的代码段？ 您还可以提供更详细的代码示例吗？

我猜您想隐藏元素“ onload”吗？ 如果是这样，那么您需要等待直到元素被加载。

window.addEventListener('load', function() {
    if(/repair/.test(window.location.href)) 
    { 
      document.getElementById('brandDropdown').closest('.row').style.display = 'none'; 
    }
});

Answer 2

解决方案是，我添加了另一个ID，以使其不会损害我的表单字段，请在下面找到解决方案。

<div id="branddrop-row" class="row" >
    <div class="col-md-12">
      <div class="form-group">
      <select id="brandDropdown" class="form-control" name="brands" required>
        <option value="">Select Brands</option>
      </select>
      </div>
    </div>
  </div>

这是根据请求隐藏的脚本。我将div ID而不是select ID称为div ID，以便它不会损害我的表单字段。

 <script type="text/javascript">
 window.addEventListener('load', function() {
    if(/services|1800/.test(window.location.href))
    {
      document.getElementById('branddrop-row').style.display = 'none';
    }
});



</script>