jQuery не видит строку в span, которая отображается с php echo

Моя php-страница выглядит примерно так (с jQuery, загруженным над сценарием). Он работает правильно (css для # desc- * меняется с display: none на display: inline), когда текст в span id = «description» является обычным текстом, но при использовании функции php echo (он получает строковое значение для $ itemdesc из URL; значение может быть «Продукт A» или «Продукт B») для отображения строки, код не работает. Я думал, что готовая функция позволит PHP / DOM загружаться, и это будет работать, но нет.

Изменить: я удалил короткий тег php, но это не помогло. (Функция эха работала с коротким тегом или без него).

Edit # 2: я сейчас использую код @Alex Andrei’s js. Но проблема, кажется, связана с использованием _GET (мои знания здесь ограничены). В качестве теста я заменил <?php $itemdesc=$_GET["itemdesc"]; > с <?php $itemdesc = 'Product A';> и затем повторил это, и JavaScript работал.

Изменить 3: Решено. строки не соответствуют 100% из-за пробелов.

<?php $itemdesc=$_GET["itemdesc"]; ?>  //can be "Product A" or "Product B"
<html>

<style>
#desc-a, #desc-b {display: none;}
</style>

You purchased: <span id="description"><?php echo $itemdesc ?></span> and
<span id="desc-a">you'll get it in 1 day.</span>
<span id="desc-b">you'll get it in 5 days.</span>

<script>
$(document).ready(function () {
debugger;
var c = document.getElementById("description").innerHTML;

if (document.getElementById("description").innerHTML == "Product A") {
document.getElementById("desc-a").style.display = "inline";

if (document.getElementById("description").innerHTML == "Product B") {
document.getElementById("desc-b").style.display = "inline";
}
});
</script>

1

Решение

Вам не нужно jQuery за это

Смотрите пример ниже

<?php

$itemdesc = trim($_GET["itemdesc"]);

?>

<script type="text/javascript">

var desc = document.getElementById("description");

switch(true){

case desc.innerHTML == 'Product A':
document.getElementById("desc-a").style.display = "inline";
break;

case desc.innerHTML == 'Product B':
document.getElementById("desc-b").style.display = "inline";
break;

}
</script>

Также ваш if блоки не открываются / закрываются должным образом.

ОБНОВИТЬ:
Я добавил trim вокруг GET покончить с любым начальным или конечным пробелом, таким как переводы строки или пробелы.

Вам определенно следует рассмотреть подход @SurrealDreams, предложенный в его ответе, поскольку он устраняет ряд проблем безопасности.

1

Другие решения

Вот более простой способ приблизиться к этой странице:

<?php
$itemdesc=$_GET["itemdesc"];

if ($itemsdesc == "Product A") {
$delay = "1 day"} elseif ($itemsdesc == "Product B") {
$delay = "5 days"} else {
$delay = "several days"}
?>

You purchased: <span id="description"><?php echo $itemdesc ?></span> and
you'll get it in <?php echo $delay ?>.

Нет JavaScript вообще. Но, пожалуйста, не вставляйте значения $ _GET прямо на страницу. Это оставляет вашу страницу открытой для атаки с помощью вредоносной ссылки.

1

Пытаясь заставить ваш скрипт работать, я обнаружил, что короткие теги <? ?>

где не работает, но ваш JavaScript работал нормально, если вы включаете JQuery

конечно.

Таким образом, вы либо включить короткие теги short_open_tag=On в вашем php.ini

или использовать <?php ?>

0

$(document).ready(function () {
var c = document.getElementById("description").innerHTML;

if (c == "Product A") {
document.getElementById("desc-a").style.display = "none";
}  <---  //this was missing btw
if (c == "Product B") {
document.getElementById("desc-b").style.display = "inline";
}
});
0

У вас может быть состояние гонки. Значение innerHTML может отображаться после завершения document.ready.

Вы можете установить интервал. Я использую плагин doTimeout jQuery в качестве интервала, чтобы проверить, имеет ли c какое-либо значение. Если нет, запустите проверку, пока не появится значение.

Например:

$.doTimeout( 100, function(){
if ( $("#description" ).text() != "") {
$("#description" ).text() == "Product A" ? $("#desc-a").css("display","inline") : $("#desc-b").css("display","inline");
return false;
}
return true;
});

Этот интервал выполняется каждые 100 мс. Как только условие возвращает true, оно выполняет манипуляции с DOM.

Возможно, не самый элегантный способ сделать это. Просто мысль.

0
По вопросам рекламы [email protected]