在AJAX请求完成之前重新加载页面

时间:2016-06-14 作者:K.Briggs

我正在开发一个WP插件,我需要能够通过单击按钮调用URL(特别是AJAX函数),但单击后页面会刷新,我认为这会阻止AJAX请求完成。

注册按钮点击后,JS意味着获取输入的值,将其组合成URL,然后将iFrame源更改为该URL(我认为称之为URL),但这会被刷新页面所抵消。

代码如下:

$intro = get_post_meta($post -> ID, $key = \'podcast_file\', true);
?>
        <div class="downloadHolder">
            <h3>Download <?php echo $post->post_title ?> (<?php echo basename($intro, ".ftb") ?>)</h3>
            <a href="<?php echo $intro;?>" download="<?php echo basename($intro) ?>" class="demoBtn">Download <?php echo basename($intro, ".ftb") ?> for PC</a>
            <!--<a href="#" class="demoBtn">Demo</a>--><br>
            <input type="text" name="emailValue" id="emailValue" placeholder="Email Address" class="emailInput" style="text-align: center;">
            <button id="UniqueLevelEmailButton" class="downloadBtn" style="margin-top: 0px; width: 100%;">Email for Mobile</button>
            <span>(We do NOT collect email addresses.)</span>
            <span id="checkMe"></span>      
            <script>
                jQuery(document).ready(function($){
                    $("#UniqueLevelEmailButton").click(function(e){
                            email = document.getElementById(\'emailValue\').value;
                            downloadurl = \'<?php admin_url(\'admin-ajax.php\');?>?action=download_email_send&postId=<?php echo $post->ID; ?>&emailValue=\'+email;
                            document.getElementById(\'emailsendframe\').src = downloadurl;
                        return false;
                    });
                    return false;
                });
            </script>
<!-- iframe for submitting to -->
<iframe name="emailsendframe" id="emailsendframe" src="javascript:void(0);" style="display:none;"></iframe>
        </div>
    <?php
return ob_get_clean();
}
add_shortcode(\'level\', \'file_download\');


/*      AJAX        */


add_action(\'wp_ajax_download_email_send\',\'download_email_send\');
add_action(\'wp_ajax_nopriv_download_email_send\',\'download_email_send\');

// note $_REQUEST will work with $_POST or $_GET methods
function download_email_send() {

    $to = $_REQUEST[\'emailValue\'];

    // preferably add some email address format validation here
    // $validate = some_email_validate_function($to);
    // if ($validated) {$message = \'Please check your email for typos.\';}
    // else {
        $post_id = $_REQUEST[\'postID\'];

    $page = get_post($post_id);
    $postName = $page->post_title;

        // ! you would need to redefine $intro here !
    $intro = get_post_meta($post_id, $key = \'podcast_file\', true);
    $path = str_replace("http://example.com/wp-content","",$intro);
        $subject = \'Download for \'.$postName;

        $msg = \'Your download for \'.$postName.\' (\'.basename($intro).\') is attached to this email.\';

    //Why am I unable to pass HTML in the message?

        $headers = \'From: Example <[email protected]>\' . "\\r\\n";
    $headers .= "MIME-Version: 1.0\\r\\n";
    $headers .= "Content-Type: text/html; charset=ISO-8859-1\\r\\n";
        $mail_attachment = array(WP_CONTENT_DIR . $path);

        $send = wp_mail($to, $subject, $msg, $headers, $mail_attachment);

        if ($send) {$message = \'Success! Your download has been sent to your email address.\';}
        else {$message = \'Error: Mail sending failed. Please contact the website administrator using the contact page.\';}
    // }

    // alert the user to the result
    echo "<script>alert(\'".$message."\');</script>";
    exit;
}

2 个回复
SO网友:FaCE

请不要将此代码投入生产

确定。因此,在我们开始回答您的问题之前,代码有很多问题需要解决。

首先,我们使用$_REQUEST 无正当理由--$_REQUEST 允许我们访问请求中发送的所有信息,这意味着$_POST[\'foo\'] $_REQUEST[\'foo\'] === $_GET[\'foo\'] and also $_COOKIE[\'foo\']! 这意味着我们只需在本地设置cookie,就可以从您的应用程序请求ID。

其次,我们要$post_id 用它来做这件事:

$post\\U id=$\\U请求[\'postID\']$page=get\\u post($post\\u id);

这意味着,一旦我们仔细检查了[get_post](https://developer.wordpress.org/reference/functions/get_post/) 并且发现它没有检查任何访问权限,这意味着您现在允许用户(您不认识的用户)获取您网站上的任何单个“帖子”。作为WordPress存储all 表中类似post的对象wp_posts 这意味着,如果您对任何类型的受保护信息使用WordPress帖子类型,那么用户只需请求即可访问该信息(理论上)。

第三,we are passing an unfiltered variable into a function a la$intro = get_post_meta($post_id, $key = \'podcast_file\', true); – 谢天谢地,WordPress为我们过滤了这些输入

第四,我们然后发送此的返回值,unchecked 创建另一个变量$path = str_replace("http://com.areonline.co.uk/wp-content","",$intro);

第五,我们使用这个($path) 变量并通过电子邮件发送as an attachment 发送人!!!

除此之外,请尝试使用jQuery.post 还可以考虑使用Localize Script(to answer the question) 同时使用event.preventDefault() 不管你不想发生什么。

在这种情况下:

$("#UniqueLevelEmailButton").click(function(e){
    e.preventDefault();
    // blah
}
<小时/>

SO网友:C C

我不能评论AJAX调用的有效性;这是一种不同于我所用的风格——但在click(function(e) { 代码,您可以尝试捕获默认页面操作以防止其触发页面刷新:

 $("#myelement).click(function(e){
     e.preventDefault();