此ajax按钮在移动设备上不起作用

时间:2019-02-18 06:14:03

标签: ajax forms button

我有一个简单的订阅者表单,他们在其中订阅时事通讯。问题:当您尝试从任何移动设备上按“提交”时,将无法使用。该表格只是“输入您的电子邮件”和一个“提交”按钮。我在Safari iOS和Samsung Note 9浏览器上尝试过,它们的性能相同。

var ajaxurl = "https://mywebsite.com/ajax.php";

            function AJAXform( formID, buttonID, resultID, emailID, firstnameID, lastnameID ){

                var selectForm = document.getElementById(formID); // Select the form by ID.
                var selectButton = document.getElementById(buttonID); // Select the button by ID.
                var selectResult = document.getElementById(resultID); // Select result element by ID.
                var emailInput =  document.getElementById(emailID); // Select email input by ID.
                var firstnameInput =  document.getElementById(firstnameID); // Select firstname input by ID.
                var lastnameInput =  document.getElementById(lastnameID); // Select lastname input by ID.

                var firstname;
                var lastname;

                function XMLhttp(){

                    var httpRequest = new XMLHttpRequest();

                    httpRequest.onreadystatechange = function(){
                        if ( this.readyState == 4 && this.status == 200 ) {
                            result = JSON.parse( this.responseText );
                            selectResult.innerHTML = result.message; // Display the result inside result element.
                            emailInput.value = '';
                            selectForm.classList.add('-subscribed');

                            if ( result.status == 1 ) {
                                selectForm.classList.remove('-subscribe-failed');
                                selectForm.classList.add('-subscribe-successful');


                            } else {
                                selectForm.classList.add('-subscribe-failed');
                            }
                        }

                    };

                    firstname = ( firstnameInput == null ) ? '' : firstnameInput.value;
                    lastname = ( lastnameInput == null ) ? '' : lastnameInput.value;

                    httpRequest.open('POST', ajaxurl, true);
                    httpRequest.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
                    httpRequest.setRequestHeader("Access-Control-Allow-Origin", "*");

                    httpRequest.send('action=niteo_subscribe&ajax=true&form_honeypot=&email=' + emailInput.value + '&firstname=' + firstname + '&lastname=' + lastname);
                }

                selectButton.onclick = function(){ // If clicked on the button.
                    if ( emailInput.value != '' ) {
                        XMLhttp();
                    }

                }

                selectForm.onsubmit = function(){ // Prevent page refresh
                    return false;
                }
            }

            /* Usage */
            window.addEventListener("load",function(event) {
                    AJAXform( 'subscribe-form', 'submit-subscribe', 'subscribe-response', 'email-subscribe', 'firstname-subscribe', 'lastname-subscribe' );
            });

0 个答案:

没有答案