長時間載入JavaScript（模式窗口）

Question

在這個網站http://nashedom.ru有JS腳本。大多數都很快。

modalka fancybox頁面（用於登錄用戶，在用戶櫃中，頁面 - >其他） - 非常緩慢。在Chrome中加載是25-28秒。在Firefox中 - 2.5秒。

數據取消了上下文。

HTML：

{% load hosts %} 
<div class="b-header"> 
    <div class="b-header__menu"> 
     <div class="container"> 
      <div class="row"> 
       <div class="col-xs-12"> 
        <div class="b-menu"> 
         <a>...</a> 
         <a>...</a> 
         <a>...</a> 
         <a>...</a> 
         <span class="b-menu__item btn_change-location"> 
         <a href="#change-location" class="fancybox dashed"> 
         {% if user.is_authenticated %} 
          View ads on site: 
          {% if user.districts.all.count > 1 %} 
           {% for district in user.districts.all %} 
            {% if forloop.last %} 
             <span>{{ district }}</span> 
            {% else %} 
             <span>{{ district }},</span> 
            {% endif %} 
           {% endfor %} 
          {% else %} 
           {% for district in user.districts.all %} 
            <span>{{ district }}</span> 
           {% endfor %} 
          {% endif %} 
          {% if user.regions.all.count > 1 %} 
           {% for region in user.regions.all %} 
            {% if forloop.last %} 
             <span>{{ region }}</span> 
            {% else %} 
             <span>{{ region }},</span> 
            {% endif %} 
           {% endfor %} 
          {% else %} 
           {% for region in user.regions.all %} 
            <span>{{ region }}</span> 
           {% endfor %} 
          {% endif %} 
          {% if user.cities.all.count > 1 %} 
           {% for city in user.cities.all %} 
            {% if forloop.last %} 
             <span>{{ city }}</span> 
            {% else %} 
             <span>{{ city }},</span> 
            {% endif %} 
           {% endfor %} 
          {% else %} 
           {% for city in user.cities.all %} 
            <span>{{ city }}</span> 
           {% endfor %} 
          {% endif %} 
         {% else %} 
           View ads on site: 
         {% endif %} 

         </a> 
         </span> 
        </div> 
       </div> 
      </div> 
     </div> 
    </div> 

模板模式窗口

{% load hosts %} 
{% load widget_tweaks static %} 
<div id="change-location"> 
<form action="{% host_url "setlocation" host "www" %}" method="post"> 
    {% csrf_token %} 

    <div id="chose-city-wrap"> 
     <div class="b-modal__title">Select your city</div> 
     <p> 
      <div class="b-modal__item"> 
       <span>{{ location_form.country.label }}</span> 
       {{ location_form.country }} 
      </div> 
     </p> 
     <p> 
      <div class="b-modal__item"> 
       <span>{{ location_form.districts.label }}</span> 
       {{ location_form.districts }} 
      </div> 
     </p> 
     <p> 
      <div class="b-modal__item"> 
       <span>{{ location_form.regions.label }}</span> 
       {{ location_form.regions }} 
      </div> 
     </p> 
     <p> 
      <div class="b-modal__item"> 
       <span>{{ location_form.cities.label }}</span> 
       {{ location_form.cities }} 
      </div> 
     </p> 


     <br /> 

     <div class="b-modal__item b-modal__item_btn"> 
      <input class="b-btn b-btn_red" type="submit" value="Сохранить"> 
     </div> 
    </div> 
</form> 
</div> 

<!-- end snippet --> 

城市下載表格所在的頁面剎車模態窗口！

<fieldset> 
     <legend>The territory of distribution of the ads</legend> 

     {{ form.country|add_class:"b-input__input js-select" }} 
     {{ form.districts|add_class:"b-input__input js-select chosen-select" }} 
     {{ form.regions|add_class:"b-input__input js-select chosen-select" }} 
     {{ form.cities|add_class:"b-input__input js-select chosen-select" }} 
     {# form.geo|add_class:"b-input__input" #} 

    </fieldset> 

Answer 1

正如你解釋，你有很多的數據來獲得（國家，城市），如果你在PHP這樣做，你會直到你retrive所有這些DATAS鎖定頁面。

爲了縮短加載時間，您只需在js（ajax）中創建所有內容。

您將您的頁面加載到城市，國家......沒有數據。

一旦頁面加載（document.ready），你可以調用你的ajax來填充你的城市，國家等等。