我正在嘗試通過 url 從評級創建評論系統。
我想使用 ajax 來檢索 url 的內容，然后在我的 js 中將其作為數字處理。
但我覺得 ajax 是在我的頁面加載后發生的，所以我的 js 什么也沒給我回傳。
你有想法解決我的問題嗎？
謝謝
（我是初學者，我調整了......注意你的眼睛！^^）
<body>
<div class="container">
<div class="medal">
<pre id="cible"></pre>
<span class="stars" id="stars" data-rating="" data-num-stars="5" ></span>
<div class="note"><span id="note"></span><span>/5</span></div>
<div class="avis"><span id="avis"></span><span> avis clients</span></div>
<div class="medal_text">Avis vérifiés</div>
</div>
</div>
</body>
ajax/JS
$.ajax({
method: "GET", // GET ou POST comme tu veut
url: "content.php", // La page qui va faire le traitement
dataType: 'json',
data: {
cle: "pre"
}, // Les donnees a envoyer
success: function (resultat) {
$('#cible').html(resultat);
}
})
// LIRE TEXT ET SORTIR TABLEAU DES 2 VALEURS
var myString = document.getElementsByTagName('pre')[0].innerHTML;
var splits = myString.split(";", 2);
console.log( splits);
console.log( splits[0]); // affiche "le premier élément"
console.log( splits[1]);
note = splits[1]
function roundHalf(note) {
return Math.round(note * 10) / 10;
}
document.getElementById("note").innerHTML = roundHalf(note);
avis = splits[0]
document.getElementById("avis").innerHTML = avis;
// $(element).attr('data-key', 'value');
var myData = document.getElementById("stars").setAttribute("data-rating", roundHalf(note));
//ES5
$.fn.stars = function () {
return $(this).each(function () {
var rating = $(this).data("rating");
var fullStar = new Array(Math.floor(rating 1)).join('<i ></i>');
var halfStar = ((rating % 1) !== 0) ? '<i ></i>' : '';
var noStar = new Array(Math.floor($(this).data("numStars") 1 - rating)).join(
'<i ></i>');
$(this).html(fullStar halfStar noStar);
});
}
//ES6
$.fn.stars = function () {
return $(this).each(function () {
const rating = $(this).data("rating");
const numStars = $(this).data("numStars");
const fullStar = '<i ></i>'.repeat(Math.floor(rating));
const halfStar = (rating % 1 !== 0) ? '<i ></i>' : '';
const noStar = '<i ></i>'.repeat(Math.floor(numStars - rating));
$(this).html(`${fullStar}${halfStar}${noStar}`);
});
}
$(function () {
$('.stars').stars();
});
php
<?php
$text = file_get_contents("https://cl.avis-verifies.com/fr/cache/2/e/8/2e88d3bd-ea3f-96a4-9db4-70d3c8494879/AWS/2e88d3bd-ea3f-96a4-9db4-70d3c8494879_infosite.txt");
echo json_encode($text);
?>
如果我直接在 html 中插入 url 的內容，
<pre style="word-wrap: break-word; white-space: pre-wrap;">16;4.14</pre>
并洗掉 ajax 部分，代碼作業正常。
最終結果
為什么，當我使用 ajax 填充下面的代碼時不起作用？
uj5u.com熱心網友回復：
在有價值的時候做作業，而不是之前。
您在 的success回呼中有值$.ajax()。JS 腳本中的所有其他代碼都在此之前運行。
JS
function roundHalf(value) {
return Math.round(value) / 10;
}
// this section runs before
$.ajax({
method: "GET",
url: "content.php",
dataType: 'json',
data: {
cle: "pre"
},
success: function (resultat) {
// NOW is the time to do the work
var splits = resultat.split(";", 2);
$("#note").text(roundHalf(splits[1]));
$("#avis").text(splits[0]);
$("#stars").data('rating', splits[1]).stars();
}
});
// this section runs before
PHP
<?php
$text = file_get_contents("https://cl.avis-verifies.com/fr/cache/2/e/8/2e88d3bd-ea3f-96a4-9db4-70d3c8494879/AWS/2e88d3bd-ea3f-96a4-9db4-70d3c8494879_infosite.txt");
header('Content-Type: text/plain; charset=utf-8');
echo $text;
?>
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/424070.html