0

まず、これが最適な解決策ではないことは認識していますが、実際の運用環境は、Magento と多くの安価なプラグインが関係する酔っぱらいの産物であるため、あまり厳しく判断しないでください。私は他人の混乱に対して責任を負うことはできません。

jQuery を使用して 1 つのページから複数のフォームを送信しようとしています。IE と FF では正常に動作します。ページには 4 つのフォームがあり、JS でそれらをループして、チェックボックスがオンになっているかどうかを確認し、 and を使用して 1 つずつ送信し.each()ます.submit()。Chrome ではjQuery(this).submit()、関数を完全に終了するまで起動せず、実際には最後のフォームのみを送信します。

jQuery 1.8.1 を使用します。作業用モックアップはこちら

コードは次のとおりです。

<!DOCTYPE html>
<html>
    <head>
        <title>asdfad</title>
        <script type="text/javascript" src=http://code.jquery.com/jquery-1.8.1.min.js"></script>
    </head>
    <body class=" listraknewsletter-index-index">

        <form id="form4" method="post" class="signup-form" 

action="http://www.example.com/action1" 
target="_blank">
            <input type="hidden" name="crvs" value="hiddenValue1"/>
<label for="checkbox">newsletter 1</label>            
<input name="checkbox" type="checkbox" 
class="signup-checkbox"  
name="sos-checkbox" />
        </form>
        <form id="form2" method="post" class="signup-form" 

action="http://www.example.com/action2" 
target="_blank">
            <input type="hidden" name="crvs" value="hiddenValue2"/>
<label for="checkbox">newsletter 2</label>            
            <input name="checkbox" type="checkbox" 
class="signup-checkbox"  
name="sos-checkbox" />
        </form>
        <form id="form3" method="post" class="signup-form" 

action="http://www.example.com/action3" 
target="_blank">
            <input type="hidden" name="crvs" value="hiddenValue3"/>
<label for="checkbox">newsletter 3</label>            
            <input name="checkbox" type="checkbox" 
class="signup-checkbox"  name="sos-checkbox" />
        </form>
        <form id="form1" method="post" class="signup-form" 

action="http://www.example.com/action4" 
target="_blank">
            <input type="hidden" name="crvs" value="hiddenValue4"/>
<label for="checkbox">newsletter 4</label>            
            <input name="checkbox" type="checkbox" 
class="signup-checkbox"  name="sos-checkbox" />
        </form>     

        <!-- Area for entering in information -->   

        <form method="post" action="/">         
        <label for="email">email</label>
                <input type="text" id = "nl_email" name="email" 
size="40" maxlength="100" value = ""/>
<label for="name">name</label>
            <input type="text" name="name" id = "nl_name" maxlength="50" size="40" value=""/>

            <input type="button" value="Subscribe" onclick="processSignups();" />
            <script type="text/javascript">
                // requires jQuery
                jQuery.noConflict();
                function processSignups() {
                    // make sure you have a valid email and name

                    // make sure email is at least not null
                    // this is not a pretty regex for sure lol,
                    // but tis' RFC 2822 valid                                  
                    var nl_email = jQuery('input#nl_email').val();
                    var re = new RegExp(/[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*@(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?/);

                    if (re.test(nl_email) == false) {
                        alert('Please enter a valid email');
                        return false;
                    }

                    // name is not null
                    if (jQuery('input#nl_name').val() == '') {
                        alert('Please enter your name');
                        return false;
                    }

                    // make sure at least one checkbox is selected
                    var checkboxes = jQuery('input.signup-checkbox');
                    var atLeastOne = false;
                    jQuery(checkboxes).each(function() {
                        if (jQuery(this).is(':checked')) {
                            atLeastOne = true;
                        }
                    });
                    if (atLeastOne == false) {
                        alert('Please select at least one newsletter checkbox');
                        return false;
                    }

                    // select your forms by class
                    // var forms = jQuery('form.signup-form');
                    // for each form

                    var formIds = new Array();

                    jQuery('form.signup-form').each(function(index) {
                        // get the checkbox
                        var checkbox;
                        checkbox = jQuery(this).children('input.signup-checkbox');
                        // if it is checked
                        if (jQuery(checkbox).is(':checked')) {
                            // add a hidden field to the form to hold the email
                            jQuery(this).append('<input type="hidden" name="email" value="' + nl_email + '" />');
                            // and submit form
                            jQuery(this).submit();

                        }

                    });

                    // might as well clear the email and name inputs
                    jQuery('input#nl_name').val('');
                    jQuery('input#nl_email').val('');
                    // return false;
                }

            </script>

        </form>

    </body>
</html>
4

1 に答える 1

1

Chrome は、他のブラウザーのように target="_blank" を扱いません。_tab を試すか、動的に変更してください$(this).attr('target', '_'+$(this).attr('id'));

于 2013-06-11T20:31:57.007 に答える