ボタンをクリックすると2つのアクションが実行されます：ファイルのダウンロードとサイン

Question

サブスクリプションボタンをクリックするたびにサインアップ（デモ済みのコードのように）を行いますが、ファイルもダウンロードします。

私はonclick = "window.location.href = '＃'"を追加しようとしましたが、何も起こりません。私はjavascriptを使用すると考えましたが、サブスクリプションはこの方法では動作しませんが、

両方の結果を満たすためにこれを行う簡単な方法はありませんか？他の投稿には電子メールのサインアップが含まれていないため、問題が発生しています。

<form action="http://someuniquemailchimpurl.us16.list-manage.com/subscribe/post?u=d6f1&amp;id=9ebc2randomlink" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate> 

    <input type="email" placeholder="email" value="" name="EMAIL" class="required email" id="mce-EMAIL"> 

<div id="mce-responses"> 

     <div class="response" id="mce-error-response" style="display:none"></div> 

     <div class="response" id="mce-success-response" style="display:none"></div> 

    </div> 

    <input type="submit" value="Subscribe" name="subscribe" id="newsletter-button"> 

</form> 

Answer 1

最初に、1つのボタンを使用して2つの全く異なるアクションを実行することは良い考えではない可能性がありますが、あなたが決定するので、このアドバイスを検討してください。それでもやりたいことがある場合は、いくつかの選択肢がありますが、すべてにJavaScriptが必要です。

オプションを使用する前に、をformタグから削除することをおすすめします。私は下の私の例でそれを削除しました。

1つの方法は、あなたがしようとしているようなonclickイベントを使用することです。ページをリロードしてサブスクリプションイベントが発生しないため、これを行う方法は機能しません。ポップアップウィンドウでファイルをダウンロードする必要があります。次に例を示します。

<form action="http://someuniquemailchimpurl.us16.list-manage.com/subscribe/post?u=d6f1&amp;id=9ebc2randomlink" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" novalidate> 
<input type="submit" onclick="downloadFile()" value="Subscribe" name="subscribe" id="newsletter-button"> 
</form> 
<script type="text/javascript"> 
    function downloadFile() { 
     var dw = window.open(); 
     dw.location.href = "the_file_url"; 
    } 
</script> 

別のオプションは、フォームがformタグにonsubmitイベントを使用して送信されたときに、ファイルをダウンロードすることです。次に例を示します。

<form action="http://someuniquemailchimpurl.us16.list-manage.com/subscribe/post?u=d6f1&amp;id=9ebc2randomlink" method="post" onsubmit="downloadFile()" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" novalidate> 
<input type="submit" value="Subscribe" name="subscribe" id="newsletter-button"> 
</form> 
<script type="text/javascript"> 
    function downloadFile() { 
     var dw = window.open(); 
     dw.location.href = "the_file_url"; 
    } 
</script> 

Answer 2

イベントバインディングを使用して、2つのアクションを実行できます。投稿アクションをダウンロードアクション（またはその逆）に変更してください： jQueryの使用：

$('#newsletter-button').click(function (e) { 
    e.preventDefault(); 

    //although it will not complete properly, ajax call should be ok to signup url 
    $.ajax({ 
     url: 'URL-FROM-SIGN-UP', 
     complete: function() { 
      // here we submit the form, get(0) needs because submit() from jQuery does not submit a form 
      $('#mc-embedded-subscribe-form').get(0).submit(); 
     } 
    }); 
});