1
我有一個自定義的頁面，在這裏我想基於客戶端輸入（代碼小額支付）WordPress的多個Ajax調用失敗
我創建了一個插件來處理，以產生應該通過Ajax多次更新的彈出窗口，並且它在第一次運行時很好，但在第二次嘗試時失敗。
問題似乎是它無法找到JavaScript插件文件。它直接到達插件php文件，它不應該。
這可能是一個問題，必須重新初始化JavaScript，但我不確定是否是這種情況或如何去做。
因此，當我點擊第二次嘗試的觸發器<a>標記時，它會將我發送到處理ajax的ajax-admin.php文件。由於它不讀取JavaScript，因此不會停止<a>的默認行爲。
希望有人能幫忙。
這裏去的代碼：
1 - 在原始頁面加載（從functions.php的）從插件（簡化的）
public function display_paydiallo_products($atts){
if(is_user_logged_in()) {
global $post;
$paydiallo = new PaydialloApi(
intval(get_option("_paydiallo_id_client", null)),
get_option("_paydiallo_key", null),
intval(get_option("_paydiallo_id_site", null)),
intval(get_option("_paydiallo_id_produit", null))
);
$html = '<div id="paiement_popup"></div>';
$html .= '<div class="bp_entry_wrapper">';
$i = 0;
foreach($paydiallo->getPaliers() as $key => $palier){
$link = admin_url('admin-ajax.php?action=pay_dialog_step1&boo_zone='.$palier['zone']);
if($i != 0) {
$html .= '<div class="entry">
<span class="title">'.$palier['palier'].'</span>
<div class="cout">'.$palier['cout'].'</div>
<div class="amount">'.get_option('paydiallo_'.$palier['zone'], "0").'</div><sub class="devise">'.get_option('_boopass_devise', '').'</sub>
<a href="' . $link . '" id="paydiallo' . $palier['zone'].'" class="do_popup btn btn-lg">'.get_option('_boopass_buybtn_label', '').'</a>
</div>';
} else {
$i++;
}
}
$html .= "</div>";
return $html;
}
}
2- PHP文件ajax_popup_paiement.php
add_action("wp_ajax_pay_dialog_step1", "pay_dialog_step1");
add_action('wp_ajax_nopriv_pay_dialog_step1', 'pay_dialog_step1');
function pay_dialog_step1(){
global $post;
$service = $_REQUEST['service'];
$boo_zone = $_REQUEST['boo_zone'];
$response = new WP_Ajax_Response;
if ($service == 'alloconv') {
$html = '<div class="bp_entry_wrapper">
<span class="close_popup_paiement">×</span>
<div class="entry normal" >
<div class="alloconv_palier_header" >
<p>' . $service . get_option('alloconv_' . $_REQUEST['boo_zone'] .'_token', '') . ' tokens </p>
</div>';
$html.= get_option('alloconv_' . $_REQUEST['boo_zone'] .'_script', '');
$html.= "</div>";
$html.= "</div>";
}
else if($service == 'paydiallo'){
$paydiallo = new PaydialloApi(
intval(get_option("_paydiallo_id_client", null)),
get_option("_paydiallo_key", null),
intval(get_option("_paydiallo_id_site", null)),
intval(get_option("_paydiallo_id_produit", null))
);
if(isset($_REQUEST['boo_zone']) && !isset($_REQUEST['boo_code'])) {
$number = $paydiallo->getNumber($_REQUEST['boo_zone']);
$link = admin_url('admin-ajax.php?action=pay_dialog_step1&boo_zone='.$_REQUEST['boo_zone'] . '&boo_code=true');
$html = '<div class="bp_entry_wrapper">
<div class="entry normal">
<span class="title">Veuillez appeler le numéro suivant</span>
<br>';
$html .= '<img src="'.$number['numberImage'].'" alt="'.$number['number'].'">';
$html .= '<br>';
$html .= '<p>Code anti-spam/mot clé : <b>'.$number['accessCode'].$number['keyword'].'</b></p>';
$html .= '<br>';
$html .= '<p>'.$number['notice'].'</p>';
$html .= '<input type="hidden" id="boo_zone" value="' . $_REQUEST['boo_zone'] .'" >';
$html .= '<input type="text" id="boo_code" name="boo_code">';
$html .= '<a href="' . $link . '" id="paydiallo_999999" class="btn btn-lg">Submit</a>';
$html .= '</div>';
$html .= '</div>';
} elseif(isset($_REQUEST['boo_code'])) {
$validation = $paydiallo->postCode($_REQUEST['boo_code']);
if($validation['state'] == false && isset($_REQUEST['boo_zone'])) {
$number = $paydiallo->getNumber($_REQUEST['boo_zone']);
$html = '<div class="bp_entry_wrapper">
<div class="entry normal">
<span class="title">Veuillez appeler le numéro suivant</span>
<br>
<p class="err_msg">Le code saisi est incorrect, veuillez réessayer.</p>
<br>
<img src="'.$number['numberImage'].'" alt="'.$number['number'].'">
<br>
<p>Code anti-spam/mot clé : <b>'.$number['accessCode'].$number['keyword'].'</b></p>
<br>
<p>'.$number['notice'].'</p>
<form action="" type="GET">
<input type="text" name="boo_code">
<input type="submit" class="btn btn-lg">
</form>
</div>
</div>';
$this->update_code($_GET['boo_code'], 'Paydiallo', false);
} elseif($validation['state'] == true) { //Validation
//some not pertinent code here
} else {
//some not pertinent code here
}
}
}
$response->add(array(
'data' => 'success',
'supplemental' => array(
'message' => $html,
'boo_zone' => $boo_zone,
'boo_code' => 'false'
),
));
$response->send();
exit();
}
add_action('init', 'ajax_popup_script');
function ajax_popup_script() {
wp_register_script("ajax_popup_script", WP_PLUGIN_URL.'/ajax-popup- paiement/ajax_popup_paiement.js', array('jquery'));
wp_localize_script('ajax_popup_script', 'ajaxPaiement', array('ajaxurl' => admin_url('admin-ajax.php')));
wp_enqueue_script('jquery');
wp_enqueue_script('ajax_popup_script');
}
3-插件的JavaScript文件（簡體）ajax_popup _paiement.js
jQuery(document).ready(function() {
jQuery(".do_popup").click(function(e) {
e.preventDefault();
var link = this;
var boo_zone= jQuery(link).attr("id");
var service;
if(boo_zone.includes('alloconv')){
service = 'alloconv';
boo_zone = boo_zone.replace('alloconv','');
}
else if(boo_zone.includes('paydiallo')){
service = 'paydiallo';
boo_zone = boo_zone.replace('paydiallo','');
}
var info = {
action: 'pay_dialog_step1',
boo_zone: boo_zone,
service:service
};
// Post to the server
jQuery.ajax({
type:"POST",
url:ajaxPaiement.ajaxurl,
data:info,
dataType:'xml',
success: function(data){
var message = jQuery(data).find('supplemental message').text();
jQuery("#paiement_popup").html(message);
jQuery("#paiement_popup").css("display","block");
}
});
});
jQuery("#paydiallo_999999").on("click",function(e) {
alert('blahblahblah');
e.preventDefault();
var service= jQuery(this).attr("id");
if(service.includes('alloconv')){
service = 'alloconv';
}
else if(service.includes('paydiallo')){
service = 'paydiallo';
}
var boo_zone = jQuery("#boo_zone").val();
var boo_code = jQuery("#boo_code").val();
var info = {
action: 'pay_dialog_step1',
boo_zone: boo_zone,
boo_code: boo_code,
service:service
};
jQuery.ajax({
type:"POST",
url:ajaxPaiement.ajaxurl,
data:info,
dataType:'xml',
success: function(data){
var message = jQuery(data).find('supplemental message').text();
jQuery("#paiement_popup").html(message);
jQuery("#paiement_popup").css("display","block");
}
});
});
jQuery(".close_popup_paiement").on("click", function() {
jQuery("#paiement_popup").css("display","none");
});
});
感謝@DRC。對於該元素，這不是必需的，因爲它已加載頁面。如果你看看我的代碼，我做了第二個元素「＃paydiallo_999999」，它是動態加載的。無論如何，我嘗試了你的建議，但它沒有幫助。 – BernardA