我有一个按钮，限制为7次单击，当单击数字5被禁用时，我的问题是，如果用户从不同的设备登录，计数将从0开始，与刷新页面相同。我的需要是，在user\\u meta中保存单击编号结果，如果再次单击，则更新，直到单击编号5，按钮更改为禁用。
在DB user\\u meta info中：user\\u id:user\\u idmeta\\u键：clickCounterTravmeta\\u值：1（单击次数）
这是页面加载时的代码，如果单击次数大于，则禁用按钮；4.Do Not Work:
<script>
window.addEventListener("load", ()=>{
if(clickCounterTrav>4)
document.getElementById("btnTraPack").disabled = true;
if(clickCounterTrav>4)
document.getElementById(\'btnTraPack\').style.pointerEvents = \'none\';
if(clickCounterTrav>4)
document.getElementById(\'btnTraPack\').style.color = "#54595F";
if(clickCounterTrav>4)
document.getElementById(\'btnTraPack\').style.borderColor = "#54595F";
if(clickCounterTrav>4)
document.getElementById("showResultsTra").style.visibility = "visible";
});
Here is the rest of code:
var clickCounterTrav = 0;
function CounterTrav() {
clickCounterTrav += 1;
document.getElementById("clickCounterTrav").innerHTML = clickCounterTrav + " Travel Pack you have Shared!";
if(clickCounterTrav>4)
document.getElementById(\'btnTraPack\').style.pointerEvents = \'none\';
if(clickCounterTrav>4)
document.getElementById(\'btnTraPack\').style.color = "#54595F";
if(clickCounterTrav>4)
document.getElementById(\'btnTraPack\').style.borderColor = "#54595F";
if(clickCounterTrav>4)
document.getElementById("resultTraveler").innerHTML = clickCounterTrav + " Travel Pack Shared.<br>Your Stock is Over!";
if(clickCounterTrav>4)
document.getElementById("showResultsTra").style.visibility = "visible";
console.log(clickCounterTrav); // 111
var CounterTrav_value = jQuery(this).attr(\'clickCounterTrav\');
jQuery.ajax({
url: \'/wp-admin/admin-ajax.php\',
data : {
action : \'CounterTrav_update\',
CounterTrav_value : CounterTrav_value,
},
beforeSend: function() {
console.log(\'Updating Field\');
},
success : function( response ) {
console.log(\'Success\');
},
});
}
</script>
console log
1
Updating Field
Success
但在DB user\\u meta中
Did Not Update Anyfunctions.php
add_action( \'wp_ajax_CounterTrav_update\', \'CounterTrav_update\' );
add_action( \'wp_ajax_nopriv_CounterTrav_update\', \'CounterTrav_update\' ); // This lines it\'s because we are using AJAX on the FrontEnd.
function CounterTrav_update(){
if(empty($_REQUEST) || !isset($_REQUEST)) {
ajaxStatus(\'error\', \'Nothing to update.\');
} else {
try {
$user = wp_get_current_user();
$CounterTrav_value = $_POST[\'clickCounterTrav\'];
if ($CounterTrav_value == \'clickCounterTrav\') {
update_user_meta( $user->ID, \'clickCounterTrav\', $_POST[\'clickCounterTrav\'] );
}
die();
} catch (Exception $e){
echo \'Caught exception: \', $e->getMessage(), "\\n";
}
}
}
你能帮帮我吗？
SO网友:Tony Abaroa
这是我的答案，希望有人能帮忙。我在代码中添加注释
<script>
//Now this windows.addEventListener, don\'t Work at All. I need some like
this, when the user came back in other session or reload the page,
The button, **still disabled** But i don\'t know how to make it work.
PLEASE ANY HELP?
window.addEventListener(\'load\', ()=>{
if(resultTraveler2>6)
document.getElementById(\'btnTraPack\').innerHTML = "Your Stock is Over!";
if(resultTraveler2>6)
document.getElementById(\'btnTraPack\').disabled = true;
if(resultTraveler2>6)
document.getElementById(\'btnTraPack\').style.pointerEvents = \'none\';
if(resultTraveler2>6)
document.getElementById(\'btnTraPack\').style.color = "#54595F";
if(resultTraveler2>6)
document.getElementById(\'btnTraPack\').style.borderColor = "#54595F";
if(resultTraveler2>6)
document.getElementById(\'showResultsTra\').style.visibility = "visible";
});
//From here, all work as i need, OK!
var clickCounterTrav = 0
function CounterTrav() {
clickCounterTrav += 1;
document.getElementById("resultTraveler1").innerHTML = clickCounterTrav;
}
var btnTraPackClick = document.querySelector(".btnTraPack");
var clicksContainer = document.querySelector(".clicksContainer");
var totalEl = document.createElement("span");
clicksContainer.appendChild(totalEl);
btnTraPackClick.addEventListener("click", function(e) {
if (!e.target.classList.contains("clicksContainer")) {
var ClickSum = document.querySelectorAll(".resultTraveler1, .resultTraveler2");
let total = (0);
ClickSum.forEach(item => {
total += parseInt(item.innerText, 10)
})
totalEl.innerHTML = total;
}
if(totalEl.innerHTML>6)
document.getElementById(\'btnTraPack\').style.pointerEvents = \'none\';
if(totalEl.innerHTML>6)
document.getElementById(\'btnTraPack\').style.color = "#54595F";
if(totalEl.innerHTML>6)
document.getElementById(\'btnTraPack\').style.borderColor = "#54595F";
if(totalEl.innerHTML>6)
document.getElementById(\'btnTraPack\').innerHTML = "Your Stock is Over!";
if(totalEl.innerHTML>6)
document.getElementById(\'showResultsTra\').style.visibility = "visible";
var CounterTrav_value = totalEl.innerHTML;
console.log(clickCounterTrav); // 111
jQuery.ajax({
url: \'/wp-admin/admin-ajax.php\',
data : {
action : \'CounterTrav_update\',
CounterTrav_value : CounterTrav_value,
},
beforeSend: function() {
console.log(\'Updating Field\');
},
success : function( response ) {
console.log(\'Success\');
},
})
});
</script>
我感谢你的帮助。谢谢
