なぜ私のjQuery関数はコード内にリストされた1つのリンクだけを開くのですか？

私は現在、チェックを行っているウェブサイトにスクリプトを実装していますが、ユーザーがチェックしたチェックボックスを確認してから、ユーザーが提出したファイルをダウンロードするとそのファイルがダウンロードされます。私が抱えている問題は、どれだけ多くのチェックボックスがクリックされても、最初のファイルだけがダウンロードされ、他のファイルはダウンロードされないことです。誰かが私が間違ってここにやって見つけることができれば、それは非常に高く評価されるだろうなぜ私のjQuery関数はコード内にリストされた1つのリンクだけを開くのですか？

// Global manual variables 
var classic; 
var racing; 
var flexer; 
// Global handbook variables 
var classicEng; 
var classicMulti; 
var flexerEng; 
var racerEng; 

// Checkbox download function 

jQuery(document).ready(function() { 
    classic = jQuery('#edit-submitted-manuals-required-1'); 
    racing = jQuery('#edit-submitted-manuals-required-2'); 
    flexer = jQuery('#edit-submitted-manuals-required-3'); 
    classicEng = jQuery('#edit-submitted-handbooks-required-1'); 
    classicMulti = jQuery('#edit-submitted-handbooks-required-2'); 
    flexerEng = jQuery('#edit-submitted-handbooks-required-3'); 
    racerEng = jQuery('#edit-submitted-handbooks-required-4'); 

    jQuery('#edit-submit').click(function() { 
     if (classicEng.is(':checked') && classicMulti.is(':checked') && flexerEng.is(':checked') && racerEng.is(':checked')) { 
      window.open('/sites/default/files/manuals/classic-xl-45-english.pdf', '_blank'); 
      window.open('/sites/default/files/manuals/classic-xl-45.pdf', '_blank'); 
      window.open('/sites/default/files/manuals/flexer-45-english.pdf', '_blank'); 
      window.open('/sites/default/files/manuals/racing-45-english.pdf', '_blank'); 

     } else if (classicEng.is(':checked') && classicMulti.is(':checked') && flexerEng.is(':checked')) { 
      window.open('/sites/default/files/manuals/classic-xl-45-english.pdf', '_blank'); 
      window.open('/sites/default/files/manuals/classic-xl-45.pdf', '_blank'); 
      window.open('/sites/default/files/manuals/flexer-45-english.pdf', '_blank'); 

     } else if (classicEng.is(':checked') && classicMulti.is(':checked')) { 
      window.open('/sites/default/files/manuals/classic-xl-45-english.pdf', '_blank'); 
      window.open('/sites/default/files/manuals/classic-xl-45.pdf', '_blank'); 

     } else if (classicEng.is(':checked') && flexerEng.is(':checked')) { 
      window.open('/sites/default/files/manuals/classic-xl-45-english.pdf', '_blank'); 
      window.open('/sites/default/files/manuals/flexer-45-english.pdf', '_blank'); 

     } else if (classicEng.is(':checked') && racerEng.is(':checked')) { 
      window.open('/sites/default/files/manuals/classic-xl-45-english.pdf', '_blank'); 
      window.open('/sites/default/files/manuals/racing-45-english.pdf', '_blank'); 

     } else if (classicMulti.is(':checked') && flexerEng.is(':checked') && racerEng.is(':checked')) { 
      window.open('/sites/default/files/manuals/classic-xl-45.pdf', '_blank'); 
      window.open('/sites/default/files/manuals/flexer-45-english.pdf', '_blank'); 
      window.open('/sites/default/files/manuals/racing-45-english.pdf', '_blank'); 

     } else if (classicMulti.is(':checked') && flexerEng.is(':checked')) { 
      window.open('/sites/default/files/manuals/classic-xl-45.pdf', '_blank'); 
      window.open('/sites/default/files/manuals/flexer-45-english.pdf', '_blank'); 

     } else if (classicEng.is(':checked') && racerEng.is(':checked')) { 
      window.open('/sites/default/files/manuals/classic-xl-45.pdf', '_blank'); 
      window.open('/sites/default/files/manuals/racing-45-english.pdf', '_blank'); 

     } else if (flexerEng.is(':checked') && racerEng.is(':checked')) { 
      window.open('/sites/default/files/manuals/flexer-45-english.pdf', '_blank'); 
      window.open('/sites/default/files/manuals/racing-45-english.pdf', '_blank'); 

     } else if (classicEng.is(':checked')) { 
      window.open('/sites/default/files/manuals/classic-xl-45-english.pdf', '_blank'); 

     } else if (classicMulti.is(":checked")) { 
      window.open('/sites/default/files/manuals/classic-xl-45.pdf', '_blank'); 

     } else if (flexerEng.is(':checked')) { 
      window.open('/sites/default/files/manuals/flexer-45-english.pdf', '_blank'); 

     } else if (racerEng.is(':checked')) { 
      window.open('/sites/default/files/manuals/racing-45-english.pdf', '_blank'); 

     } else if (classic.is(':checked') && racing.is(':checked') && flexer.is(':checked')) { 
      window.open('/sites/default/files/manuals/classic-xl-parts.pdf', '_blank'); 
      window.open('/sites/default/files/manuals/racing-45-parts.pdf', '_blank'); 
      window.open('/sites/default/files/manuals/flexer-xl-parts.pdf', '_blank'); 

     } else if (classic.is(':checked') && flexer.is(":checked")) { 
      window.open('/sites/default/files/manuals/classic-xl-parts.pdf', '_blank'); 
      window.open('/sites/default/files/manuals/flexer-xl-parts.pdf', '_blank'); 

     } else if (classic.is(':checked') && racing.is(":checked")) { 
      window.open('/sites/default/files/manuals/classic-xl-parts.pdf', '_blank') 
      window.open('/sites/default/files/manuals/racing-45-parts.pdf', '_blank'); 

     } else if (racing.is(':checked') && flexer.is(':checked')) { 
      window.open('/sites/default/files/manuals/racing-45-parts.pdf', '_blank'); 
      window.open('/sites/default/files/manuals/flexer-xl-parts.pdf', '_blank'); 

     } else if (classic.is(':checked')) { 
      window.open('/sites/default/files/manuals/classic-xl-parts.pdf', '_blank'); 

     } else if (racing.is(':checked')) { 
      window.open('/sites/default/files/manuals/racing-45-parts.pdf', '_blank'); 

     } else if (flexer.is(':checked')) { 
      window.open('/sites/default/files/manuals/flexer-xl-parts.pdf', '_blank'); 

     } else { 
      alert("Please choose a file to download"); 
     } 
    }); 
});

：

は、ここに私のコードです！

出典

2016-08-10 Anonymous

また、Chromeは自動的にポップアップをブロックします。それは私のためにそうしました。 – evolutionxbox

また、window.open（ '/ sites/default/files/manuals /' + filename、 '_blank'）を使用してコードを大幅に減らすこともできます。 if-else条件でファイル名を設定する。 –

この問題は、ページの読み込みが完了する前に手動変数とハンドブック変数が宣言されているために発生していると考えられます。同じ場所で宣言することをお勧めしますが、要素がレンダリングされたことを保証できるjQuery(document).ready()の内部でそれらを更新してください。

結果jQuery(document).ready(function(){});は次のようになります。彼らは、グローバル変数残るように、我々はjQuery(document).ready()外で宣言したが内部にそれらを更新していき

// Manual variables 
    var classic; 
    var racing; 
    var flexer; 

    // Handbook variables 
    var classicEng; 
    var classicMulti; 
    var flexerEng; 
    var racerEng; 

    // Handbook download function 
    jQuery(document).ready(function() { 
      classic = jQuery('#edit-submitted-manuals-required-1'); 
      racing = jQuery('#edit-submitted-manuals-required-2'); 
      flexer = jQuery('#edit-submitted-manuals-required-3'); 

      // Handbook variables 
      classicEng = jQuery('#edit-submitted-handbooks-required-1'); 
      classicMulti = jQuery('#edit-submitted-handbooks-required-2'); 
      flexerEng = jQuery('#edit-submitted-handbooks-required-3'); 
      racerEng = jQuery('#edit-submitted-handbooks-required-4'); 

     jQuery('#edit-submit').click(function() { 
      if (classicEng.is(':checked')) { 
       window.open('/sites/default/files/manuals/file.pdf'); 
      } else if (classicMulti.is(":checked")) { 
       window.open('/sites/default/files/manuals/file.pdf'); 
      } else if (flexerEng.is(":checked")) { 
       window.open('/sites/default/files/manuals/file.pdf'); 
      } else if (racerEng.is(":checked")) { 
       window.open('/sites/default/files/manuals/file.pdf'); 
      } else if (classic.is(':checked')) { 
       window.open('/sites/default/files/manuals/file.pdf');   
      } else if (racing.is(":checked")) {   
       window.open('/sites/default/files/manuals/file.pdf'); 
      } else if (flexer.is(":checked")) { 
       window.open('/sites/default/files/manuals/file.pdf'); 
      } else { 
       alert("Please choose a file to download"); 
      } 
     }); 
    });

理由、です。 jQuery(document).ready()の中にそれらを宣言していれば、jQuery(document).ready()以外の関数の範囲外になります。

複数のファイルをダウンロードできるようにするというコメントに応じて、ファイル名を配列にプッシュすることをお勧めします。配列にプッシュしたら、forループを使ってそれらを繰り返し、呼び出しを1つずつ実行することができます。

もう一度、サーバーサイドコードを使用していた場合は、これらの別々のファイルを1つのzipファイルに追加して、ユーザーにとってさらに簡単にすることができます。

 jQuery('#edit-submit').click(function() { 
      var myArray = [] 
      if (classicEng.is(':checked')) { 
       myArray.push('/sites/default/files/manuals/file.pdf'); 
      } 
      if (classicMulti.is(":checked")) { 
       myArray.push('/sites/default/files/manuals/file.pdf'); 
      } 
      if (flexerEng.is(":checked")) { 
       myArray.push('/sites/default/files/manuals/file.pdf'); 
      } 
      if (racerEng.is(":checked")) { 
       myArray.push('/sites/default/files/manuals/file.pdf'); 
      } 
      if (classic.is(':checked')) { 
       myArray.push('/sites/default/files/manuals/file.pdf');   
      } 
      if (racing.is(":checked")) {   
       myArray.push('/sites/default/files/manuals/file.pdf'); 
      } 
      if (flexer.is(":checked")) { 
       myArray.push('/sites/default/files/manuals/file.pdf'); 
      } 
      //Find out how many files the user has selected 
      var totalFiles = myArray.length; 
      //Throw an error if no boxes are checked 
      if (totalFiles == 0) { 
       alert("Please choose a file to download"); 
      } else { 
        for (var i = 0; i < totalFiles; i++) { 
          //Open a download window for each URL in the array 
          window.open(myArray[i]); 
        } 
      } 
      } 
     }); 
    });

そして今、簡単に新しいコードを説明する：jQueryの/ Javascriptが非サーバー側のソリューションのために、このようになります。まず、myArrayという配列を宣言しました。 if/elseステートメントをifステートメントに変更し、push（追加）して、すべてのチェックボックスのURLをアレイに追加しました。

各ボックスをチェックしてURLを配列に追加すると、totalItemsという別の変数が宣言され、配列にプッシュされる項目の数がチェックされます。配列に項目がない場合は、以前elseステートメントにあったalertを投げます。

がご使用のアレイにのアイテムがある場合、forループは各アイテムを別々に通過し、それぞれのダウンロードウィンドウを開きます。

私はそれが助けてくれることを願っています！

出典

2016-08-11 13:03:45

これについて考えてみると、jQueryの 'append（）'を使って、ユーザーがダウンロードしたいと思っているファイルごとに別の 'iframe'をページに追加することができます。これはCSSの 'display：none'を使って非表示にする' div'コンテナ内にある可能性があります。追加したら、ダウンロードするファイルに対応するようにそれぞれのsrcを変更し、新しいウィンドウを開くことなく各ファイルのダウンロードができる 'hey-presto' –

if/else ifを使用しています。ちょうどifステートメントを使用する必要があります。最初の真のifまたはelse ifステートメントの後では、すべてelse ifおよびelseステートメントはスキップされるため、if/else if/else構造体では1つのコードブロックのみが実行されます。

出典

2016-08-10 14:49:47 cameronroytaylor

この答えにタグを付けるには、単純なif文で新しいウィンドウを開くだけで、必要なすべての機能が得られます。新しいウィンドウでダウンロードリンクを開くことは、チェックボックスがいくつあるかを完全に独立させたアクションです。それぞれのケースは他のケースを知らないことがあります。 – MikeJannino

私はおそらくコードを別に構造化するでしょうが、私はそれがどのように問題を解決するのか分かりません。もし彼が 'else if'の全てを' if'に変更したのであれば、それはあなたに重複ファイルを与えるでしょう。 –

こんにちは@cameronroytaylor、私はまだこれが問題を解決する方法を理解していません。最初のIF文を見てみましょう。あなたが言ったように、それが本当なら、その下のelsesを無視します（これは私がやりたいことです）。その後、同じIF文にリストされているものだけでなく、まだ1つのダウンロードを開いているのはなぜですか？ –

else ifを使用しているためです。しかし、新しいウィンドウをすばやく開こうとすると、ほとんどのブラウザーはデフォルトで新しいウィンドウを開くことをブロックします。ユーザーは自分の側でポップアップを許可する必要があります。

出典

2016-08-10 15:03:29 Noldor

私は2番目の部分がポスターの質問に対する答えだと思います。 Chromeは最初のポップアップを開き、他のポップアップをブロックします。「ポップアップブロック」メッセージが元のタブに表示されているため、気づくのが難しい場合があります。ポップアップの間にタイマーを設定することさえ役に立たない。 – agriffin

なぜ私のjQuery関数はコード内にリストされた1つのリンクだけを開くのですか？

答えて

関連する問題