0

У меня на сайте есть такой тег

 <div id="ad-car-detail-content">
 </div> 

в который контент загружается с помощью этого скрипта

<script type="text/javascript" charset="utf-8" src="http://avtousta.ucoz.com/js/board/add-cars-board.js"></script>

вместе получается вот так.

<div id="ad-car-detail-content">
</div>
<script type="text/javascript">
  $("select#car_model_id").change(
    function() {
      var str = "";
      $("select#car_model_id option:selected").each(
        function() {
          str += $(this).text() + " ";
        });
      $("input#bdF1").val(str);
    }).change();
</script>
<script type="text/javascript">
  $("select.car_Marka")
    .on("change",
      function() {
        var selected_option =
          $("select.car_Marka option:selected");
        $("input.catSelector9")
          .attr("id", selected_option.attr("id"))
          .attr("value", selected_option.attr("value"));
      });
</script>
<script type="text/javascript" charset="utf-8" src="http://avtousta.ucoz.com/js/board/add-cars-board.js"></script>

При выборе в Avtomobil tipi какого-то типа авто в Bütün Markalar при выборе вместо Marka secin какой-то марки авто, в INPUT 0 значение должно меняться на INPUT VALUE и INPUT ID выбранной марки авто.

В Model secin при выборе модели авто значение INPUT 0 должно меняться на INPUT VALUE выбранного элемента OPTION. Например, мы выбрали <OPTION>w202</OPTION> Значение INPUT VALUE должно быть таким: <input value="w202"> Но почему то значение VALUE и ID не меняется при такой загрузке.

А если возьму код целиком и вставлю на страницу, вот так, тогда работает.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<div id="ad-cars-detail-id" class="ad-cars-detail-right">
 
 

 
 
 
 <div id="ad-car-detail-content">
 <form method="post" id="addEntForm" style="margin:0px" name="addform" enctype="multipart/form-data" action="http://avtousta.ucoz.com/board" onsubmit="openery();return false;">
 <input type="hidden" name="jkd498" value="1">
 <input type="hidden" name="jkd428" value="1">
 <div class="manTable" id="bdM64">
 
 
 <div class="ad-cars-detail-right">






  <div id="ad-car-detail-content">
    
      <input type="hidden" name="jkd498" value="1">
      <input type="hidden" name="jkd428" value="1">
      <div class="manTable" id="bdM64">
        <div id="bdM49">
          <div class="manTd2" id="bdM51">
            <select id="bdF18" class="manFlFlt1" name="filter1" onchange="fillMark();">
              <option id="bdM50" value="0">Avtomobil: Tipi</option>
              <option value="1">Minik avtomobilləri</option>
              <option value="2">Minik avtomobilləri kommersiya</option>
              <option value="3">Yük Avtomobilləri</option>
              <option value="4">Avtobuslar</option>
              <option value="5">Qoşqu dartanlar</option>
              <option value="6">Qoşqular</option>
              <option value="7">Çıxarıla bilinən kuzalar</option>
              <option value="8">Motoskletlər</option>
              <option value="9">Baggilər</option>
              <option value="10">Skuterlər</option>
              <option value="11">Moto yolsuzluq</option>
              <option value="12">Karting</option>
              <option value="13">Yolsuzluq moto amfibi</option>
              <option value="14">Yolsuzluq Qar üçün</option>
            </select>
          </div>
        </div>
        <div id="bdM61">
          <div class="manTd2" id="bdM63">
            <input class="catSelector9" checked="checked" type="button" value="90001" name="ocat" id="cus90001">
            <div id="car_mark">
              <select class="car_Marka" id="car_Marka" onchange="fillModel();">
                <option id="0" value="0">Marka: Seçin</option>
                <option value="90001" id="cus90001">AC</option>
                <option value="90002" id="cus90002">Acura</option>
                <option value="90003" id="cus90003">Adler</option>
                <option value="90004" id="cus90004">Alfa Romeo</option>
                <option value="90005" id="cus90005">Alpina</option>
                <option value="90006" id="cus90006">Alpine</option>
                <option value="90007" id="cus90007">AM General</option>
                <option value="90008" id="cus90008">AMC</option>
                <option value="90009" id="cus90009">Ariel</option>
                <option value="90010" id="cus90010">Aro</option>
                <option value="90011" id="cus90011">Asia</option>
                <option value="90012" id="cus90012">Aston Martin</option>
                <option value="90013" id="cus90013">Audi</option>
                <option value="90014" id="cus90014">Austin</option>
                <option value="90015" id="cus90015">Autobianchi</option>
                <option value="90016" id="cus90016">Baltijas Dzips</option>
                <option value="90017" id="cus90017">Beijing</option>
                <option value="90018" id="cus90018">Bentley</option>
                <option value="90019" id="cus90019">Bertone</option>
                <option value="90020" id="cus90020">Bitter</option>
                <option value="90021" id="cus90021">BMW</option>
                <option value="90022" id="cus90022">Borgward</option>
                <option value="90023" id="cus90023">Brabus</option>
                <option value="90024" id="cus90024">Brilliance</option>
                <option value="90025" id="cus90025">Bristol</option>
                <option value="90026" id="cus90026">Bufori</option>
                <option value="90027" id="cus90027">Bugatti</option>
                <option value="90028" id="cus90028">Buick</option>
                <option value="90029" id="cus90029">BYD</option>
                <option value="90030" id="cus90030">Byvin</option>
                <option value="90031" id="cus90031">Cadillac</option>
                <option value="90032" id="cus90032">Callaway</option>
                <option value="90033" id="cus90033">Carbodies</option>
                <option value="90034" id="cus90034">Caterham</option>
                <option value="90035" id="cus90035">Changan</option>
                <option value="90036" id="cus90036">ChangFeng</option>
                <option value="90037" id="cus90037">Chery</option>
                <option value="90038" id="cus90038">Chevrolet</option>
                <option value="90039" id="cus90039">Chrysler</option>
                <option value="90040" id="cus90040">Citroen</option>
                <option value="90041" id="cus90041">Cizeta</option>
                <option value="90042" id="cus90042">Coggiola</option>
                <option value="90043" id="cus90043">Dacia</option>
                <option value="90044" id="cus90044">Dadi</option>
                <option value="90045" id="cus90045">Daewoo</option>
                <option value="90046" id="cus90046">DAF</option>
                <option value="90047" id="cus90047">Daihatsu</option>
                <option value="90048" id="cus90048">Daimler</option>
                <option value="90049" id="cus90049">Datsun</option>
                <option value="90050" id="cus90050">De Tomaso</option>
                <option value="90051" id="cus90051">DeLorean</option>
                <option value="90052" id="cus90052">Derways</option>
                <option value="90053" id="cus90053">DeSoto</option>
                <option value="90054" id="cus90054">Dodge</option>
                <option value="90055" id="cus90055">DongFeng</option>
                <option value="90056" id="cus90056">Doninvest</option>
                <option value="90057" id="cus90057">Donkervoort</option>
                <option value="90058" id="cus90058">DS</option>
                <option value="90059" id="cus90059">E-Car</option>
                <option value="90060" id="cus90060">Eagle</option>
                <option value="90061" id="cus90061">Eagle Cars</option>
                <option value="90062" id="cus90062">Ecomotors</option>
                <option value="90063" id="cus90063">FAW</option>
                <option value="90064" id="cus90064">Ferrari</option>
                <option value="90065" id="cus90065">Fiat</option>
                <option value="90066" id="cus90066">Fisker</option>
                <option value="90067" id="cus90067">Ford</option>
                <option value="90068" id="cus90068">Foton</option>
                <option value="90069" id="cus90069">FSO</option>
                <option value="90070" id="cus90070">Fuqi</option>
                <option value="90071" id="cus90071">Geely</option>
                <option value="90072" id="cus90072">Geo</option>
                <option value="90073" id="cus90073">GMC</option>
                <option value="90074" id="cus90074">Gonow</option>
                <option value="90075" id="cus90075">Gordon</option>
                <option value="90076" id="cus90076">Great Wall</option>
                <option value="90077" id="cus90077">Hafei</option>
                <option value="90078" id="cus90078">Haima</option>
                <option value="90079" id="cus90079">Haval</option>
                <option value="90080" id="cus90080">Hawtai</option>
                <option value="90081" id="cus90081">Hindustan</option>
                <option value="90082" id="cus90082">Holden</option>
                <option value="90083" id="cus90083">Honda</option>
                <option value="90084" id="cus90084">HuangHai</option>
                <option value="90085" id="cus90085">Hummer</option>
                <option value="90086" id="cus90086">Hyundai</option>
                <option value="90087" id="cus90087">Infiniti</option>
                <option value="90088" id="cus90088">Innocenti</option>
                <option value="90089" id="cus90089">Invicta</option>
                <option value="90090" id="cus90090">Iran Khodro</option>
                <option value="90091" id="cus90091">Isdera</option>
                <option value="90092" id="cus90092">Isuzu</option>
                <option value="90093" id="cus90093">IVECO</option>
                <option value="90094" id="cus90094">JAC</option>
                <option value="90095" id="cus90095">Jaguar</option>
                <option value="90096" id="cus90096">Jeep</option>
                <option value="90097" id="cus90097">Jensen</option>
                <option value="90098" id="cus90098">JMC</option>
                <option value="90099" id="cus90099">Kia</option>
                <option value="90100" id="cus90100">Koenigsegg</option>
                <option value="90101" id="cus90101">KTM</option>
                <option value="90102" id="cus90102">Lamborghini</option>
                <option value="90103" id="cus90103">Lancia</option>
                <option value="90104" id="cus90104">Land Rover</option>
                <option value="90105" id="cus90105">Landwind</option>
                <option value="90106" id="cus90106">Lexus</option>
                <option value="90107" id="cus90107">Liebao Motor</option>
                <option value="90108" id="cus90108">Lifan</option>
                <option value="90109" id="cus90109">Lincoln</option>
                <option value="90110" id="cus90110">Lotus</option>
                <option value="90111" id="cus90111">LTI</option>
                <option value="90112" id="cus90112">Luxgen</option>
                <option value="90113" id="cus90113">Mahindra</option>
                <option value="90114" id="cus90114">Marcos</option>
                <option value="90115" id="cus90115">Marlin</option>
                <option value="90116" id="cus90116">Marussia</option>
                <option value="90117" id="cus90117">Maruti</option>
                <option value="90118" id="cus90118">Maserati</option>
                <option value="90119" id="cus90119">Maybach</option>
                <option value="90120" id="cus90120">Mazda</option>
                <option value="90121" id="cus90121">McLaren</option>
                <option value="90122" id="cus90122">Mega</option>
                <option value="90123" id="cus90123">Mercedes-Benz</option>
                <option value="90124" id="cus90124">Mercury</option>
                <option value="90125" id="cus90125">Metrocab</option>
                <option value="90126" id="cus90126">MG</option>
                <option value="90127" id="cus90127">Microcar</option>
                <option value="90128" id="cus90128">Minelli</option>
                <option value="90129" id="cus90129">MINI</option>
                <option value="90130" id="cus90130">Mitsubishi</option>
                <option value="90131" id="cus90131">Mitsuoka</option>
                <option value="90132" id="cus90132">Morgan</option>
                <option value="90133" id="cus90133">Morris</option>
                <option value="90134" id="cus90134">Nissan</option>
                <option value="90135" id="cus90135">Noble</option>
                <option value="90136" id="cus90136">Oldsmobile</option>
                <option value="90137" id="cus90137">Opel</option>
                <option value="90138" id="cus90138">Osca</option>
                <option value="90139" id="cus90139">Packard</option>
                <option value="90140" id="cus90140">Pagani</option>
                <option value="90141" id="cus90141">Panoz</option>
                <option value="90142" id="cus90142">Perodua</option>
                <option value="90143" id="cus90143">Peugeot</option>
                <option value="90144" id="cus90144">PGO</option>
                <option value="90145" id="cus90145">Piaggio</option>
                <option value="90146" id="cus90146">Plymouth</option>
                <option value="90147" id="cus90147">Pontiac</option>
                <option value="90148" id="cus90148">Porsche</option>
                <option value="90149" id="cus90149">Premier</option>
                <option value="90150" id="cus90150">Proton</option>
                <option value="90151" id="cus90151">PUCH</option>
                <option value="90152" id="cus90152">Puma</option>
                <option value="90153" id="cus90153">Qoros</option>
                <option value="90154" id="cus90154">Qvale</option>
                <option value="90155" id="cus90155">Ravon</option>
                <option value="90156" id="cus90156">Reliant</option>
                <option value="90157" id="cus90157">Renaissance</option>
                <option value="90158" id="cus90158">Renault</option>
                <option value="90160" id="cus90160">Rezvani</option>
                <option value="90161" id="cus90161">Rimac</option>
                <option value="90162" id="cus90162">Rolls-Royce</option>
                <option value="90163" id="cus90163">Ronart</option>
                <option value="90164" id="cus90164">Rover</option>
                <option value="90165" id="cus90165">Saab</option>
                <option value="90166" id="cus90166">Saleen</option>
                <option value="90167" id="cus90167">Santana</option>
                <option value="90168" id="cus90168">Saturn</option>
                <option value="90169" id="cus90169">Renault Samsung</option>
                <option value="90170" id="cus90170">SEAT</option>
                <option value="90171" id="cus90171">ShuangHuan</option>
                <option value="90172" id="cus90172">Skoda</option>
                <option value="90173" id="cus90173">Smart</option>
                <option value="90174" id="cus90174">Soueast</option>
                <option value="90175" id="cus90175">Spectre</option>
                <option value="90176" id="cus90176">Spyker</option>
                <option value="90177" id="cus90177">SsangYong</option>
                <option value="90178" id="cus90178">Subaru</option>
                <option value="90179" id="cus90179">Suzuki</option>
                <option value="90180" id="cus90180">Talbot</option>
                <option value="90181" id="cus90181">TATA</option>
                <option value="90182" id="cus90182">Tatra</option>
                <option value="90183" id="cus90183">Tazzari</option>
                <option value="90184" id="cus90184">Tesla</option>
                <option value="90185" id="cus90185">Tianma</option>
                <option value="90186" id="cus90186">Tianye</option>
                <option value="90187" id="cus90187">Tofas</option>
                <option value="90188" id="cus90188">Toyota</option>
                <option value="90189" id="cus90189">Trabant</option>
                <option value="90190" id="cus90190">Tramontana</option>
                <option value="90191" id="cus90191">Triumph</option>
                <option value="90192" id="cus90192">TVR</option>
                <option value="90193" id="cus90193">Ultima</option>
                <option value="90194" id="cus90194">Vauxhall</option>
                <option value="90195" id="cus90195">Vector</option>
                <option value="90196" id="cus90196">Venturi</option>
                <option value="90197" id="cus90197">Volkswagen</option>
                <option value="90198" id="cus90198">Volvo</option>
                <option value="90199" id="cus90199">Vortex</option>
                <option value="90200" id="cus90200">W Motors</option>
                <option value="90201" id="cus90201">Wartburg</option>
                <option value="90202" id="cus90202">Westfield</option>
                <option value="90203" id="cus90203">Wiesmann</option>
                <option value="90204" id="cus90204">Willys</option>
                <option value="90205" id="cus90205">Xin Kai</option>
                <option value="90206" id="cus90206">Zastava</option>
                <option value="90207" id="cus90207">Zenos</option>
                <option value="90208" id="cus90208">Zenvo</option>
                <option value="90209" id="cus90209">Zotye</option>
                <option value="90210" id="cus90210">ZX</option>
                <option value="90211" id="cus90211">Avtokam</option>
                <option value="90212" id="cus90212">Astro</option>
                <option value="90213" id="cus90213">Bronto</option>
                <option value="90214" id="cus90214">VAZ (Lada)</option>
                <option value="90215" id="cus90215">QAZ</option>
                <option value="90216" id="cus90216">YO-Mobil</option>
                <option value="90217" id="cus90217">ZAZ</option>
                <option value="90218" id="cus90218">ZİL</option>
                <option value="90219" id="cus90219">ZİS</option>
                <option value="90220" id="cus90220">İJ</option>
                <option value="90221" id="cus90221">KaMaz</option>
                <option value="90222" id="cus90222">Kanonir</option>
                <option value="90223" id="cus90223">Kombat</option>
                <option value="90224" id="cus90224">LuAZ</option>
                <option value="90225" id="cus90225">Moskviç</option>
                <option value="90226" id="cus90226">SeAZ</option>
                <option value="90227" id="cus90227">SMZ</option>
                <option value="90228" id="cus90228">TaqAZ</option>
                <option value="90229" id="cus90229">UAZ</option>
                <option value="90230" id="cus90230">Eksklyuziv</option>
              </select>
            </div>
          </div>
        </div>
        <div id="bdM5">
          <div id="car_model">
            <select id="car_model_id">
              <option value="0">Model: Seçin</option>
              <option value="10001">378 GT Zagato</option>
              <option value="10002">ACE</option>
              <option value="10003">Aceca</option>
              <option value="10004">Cobra</option>
              <option value="10001">378 GT Zagato</option>
              <option value="10002">ACE</option>
              <option value="10003">Aceca</option>
              <option value="10004">Cobra</option>
            </select>
          </div>
          <input value="378 GT Zagato " type="button" id="bdF1" name="title">
        </div>
        
        <input type="hidden" name="a" value="12">
        <input type="hidden" name="ssid" value="Yats5PDJ">
        <input type="hidden" id="numi" value="1">
      </div>
    
  </div>
  <script type="text/javascript">
    $("select#car_model_id").change(
      function() {
        var str = "";
        $("select#car_model_id option:selected").each(
          function() {
            str += $(this).text() + " ";
          });
        $("input#bdF1").val(str);
      }).change();
  </script>
  <script type="text/javascript">
    $("select.car_Marka")
      .on("change",
        function() {
          var selected_option =
            $("select.car_Marka option:selected");
          $("input.catSelector9")
            .attr("id", selected_option.attr("id"))
            .attr("value", selected_option.attr("value"));
        });
  </script>







</div>
 
 
 
</div></form>
 <div id="bdM65">
 <div class="manTdBut" id="bdM66">
 
 </div>
 </div>
 <input type="hidden" name="a" value="12">
 <input type="hidden" name="ssid" value="Yats5PDJ">
 <input type="hidden" id="numi" value="1">
 </div>
 
 </div>

1
  • Я так понял что тут какой то код загружается поздно . и скрипт функция не видеть его, можно ли написать функции без jquery или как то по другому ? 29 дек 2015 в 16:55

1 ответ 1

2

Дело в том, что разметка в форме формируется полностью динамически и на первых порах, пока в первом select'е ничего не выбрано, у остальных нет даже атрибутов id и class, чтобы прикрепить необходимые обработчики. Не говоря уже про сами данные.

Если каким-то образом "отловить" момент загрузки данных и выполнить вот такую функцию:

function test()
{   
  $("select#car_model_id").change(
    function() {
      var str = "";
      $("select#car_model_id option:selected").each(
        function() {
          str += $(this).text() + " ";
        });
      $("input#bdF1").val(str);
    }).change();
  $("select.car_Marka")
    .on("change",
      function() {
        var selected_option =
          $("select.car_Marka option:selected");
        $("input.catSelector9")
          .attr("id", selected_option.attr("id"))
          .attr("value", selected_option.attr("value"));
      }); 
}

Всё начинает прекрасно работать. Прикрепить обработчики при загрузке данных можно, например, следующим образом.

    $("document").ready(function(){
           $("#ad-car-detail-content").one("change",function(){
              test();
              document.getElementById("car_mark").setAttribute("onchange","test()");       
           });  
        });

Конечно, данное решение, это по своей сути "костыль", но, по крайней мере, оно способно решить проблему с виджетом, который Вы используете.

1
  • Спасибо вам огромное! все отлично работает. 5+++ 30 дек 2015 в 6:19

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.