Значение Javascript не определено при переходе из PHP - PullRequest
Новая
       6

Значение Javascript не определено при переходе из PHP

0 голосов
/ 24 октября 2011

ОБНОВЛЕНИЕ: Спасибо всем, кто помог. Я надеюсь, что множество решений здесь могут послужить ориентиром для тех, кто сталкивается с подобными трудностями.

Я читаю из текстового файла с помощью PHP, и мне нужно передать строку в JS для манипуляции. Я попробовал более прямой способ размещения PHP во внешнем файле JS, но это не сработало, поэтому я прибегаю к использованию пустого контейнера div. Тем не менее, в JS я все еще получаю неопределенное значение. Файл правильно читает в значение div, он просто не передается в мой внешний файл javascript.

HTML: 

<?php
    $world = file_get_contents('http://url.com/testworld.txt');
    //echo $world;
?>

<html>

    <head>
        <script src="http://code.jquery.com/jquery-latest.js"></script>
        <script type="text/javascript" src="js/game.js"></script>
    </head>

    <body onload="init()">
        <canvas id="game" width="650" height="366" style="border: 2px solid black;"></canvas>
        <br />
        <h1> Currently in development.</h1>
        <br />
        <div id="world" value="<?php echo $world; ?>" />
    </body>

</html>

И JS: 

var world = document.getElementById('world').value;

document.write(world);

Если есть способ заставить просто извлекать переменную из PHP во внешнем файле javascript, я бы предпочел это сделать.

Ответы [ 7 ]

1 голос
/ 24 октября 2011

Очень просто передавать данные из PHP -> JS, не прибегая к их скрытию внутри DOM.Хитрость заключается в функции json_encode () - она ​​преобразует строки php, массив и т. Д. В допустимый формат javascript.См. Ваш пример ниже, исправленный: 

<?php
    $world = file_get_contents('http://url.com/testworld.txt');
?>
<html>
<head>
    <script src="http://code.jquery.com/jquery-latest.js"></script>
    <script type="text/javascript" src="js/game.js"></script>
</head>
<body onload="init()">
    <script type="text/javascript">
        //World is defined here, and accessible to the javascript that runs on the page
        var world = <?=json_encode($world)?>;
    </script>
    <canvas id="game" width="650" height="366" style="border: 2px solid black;"></canvas>
    <br />
    <h1> Currently in development.</h1>
    <br />
</body>

Я почти уверен, что ваши проблемы возникают из-за способа, которым область видимости переменных работает в javascript.Этот простой пример должен работать на вас: 

<?php
    $foo = "\"Hello world!\"";
?>
<html>
<head>
</head>
<body>
    <script type="text/javascript">
        var foo = <?=json_encode($foo)?>;
        alert("The value of foo is: " + foo);
    </script>
</body>
</html>

Таким образом, в контексте встроенного сценария присутствует переменная foo.Возможно, если бы ваш код выглядел следующим образом: 

<script type="text/javascript">
    //Load the game world, and pass to the javascript lib
    var world = <?=json_encode($world)?>;
    loadWorld(world);
</script>

, тогда вам не пришлось бы так сильно беспокоиться о области видимости?

1 голос
/ 24 октября 2011

Другой способ: в вашем php 

<div id="world" data-world="<?php echo $world; ?>" />

В вашем JS: 

$('#world').attr('data-world');

Также вы можете убедиться, что значение $ world правильно экранировано для использования в качествеатрибут html

1 голос
/ 24 октября 2011

value имеет особое значение для элементов DOM (оно относится к значению текстовых полей и т. Д.).Вместо этого вы можете использовать атрибут данных HTML5 , такой как data-value, а затем изучить его, используя document.getElementById('world').getAttribute('data-value');.

. Однако лучше использовать скрытый ввод, напримеркак 

<input type="hidden" id="world" value="<?php echo $world; ?>" />

, а затем оставьте скрипт как есть.

0 голосов
/ 24 октября 2011

Вместо того, чтобы указывать значение в теге div, вы должны указать это значение в скрытом поле ввода. Это лучший подход, как этот 

<head>
    <script src="http://code.jquery.com/jquery-latest.js"></script>
    <script type="text/javascript" src="js/game.js"></script>
</head>

<body onload="init()">
    <canvas id="game" width="650" height="366" style="border: 2px solid black;"></canvas>
    <br />
    <h1> Currently in development.</h1>
    <br />
    <input type="hidden" name="world" id="world" value="<?php echo $world;?>"/>         
</body>

</html>

, вы также должны указать тег формы.указав тег формы, вы можете иметь больше способов получить доступ к элементу, используя javascript.

, если вы хотите использовать div, тогда это должно быть так .. 

<div id="world"><?php echo $world;?></div>

в js вы можете получить доступ$ world по этому коду .. 

var world = document.getElementById('world').innerHTML;
0 голосов
/ 24 октября 2011

Попробуйте изменить: 

<div id="world" value="<?php echo $world; ?>" />

на: 

<div id="world"><?php echo $world; ?></div>

и измените: 

getElementById('world').value;

на: 

getElementById('world').innerHTML;

Есливам нужно добавить стиль display: none; в div, чтобы скрыть его.

0 голосов
/ 24 октября 2011

Я не уверен в этом, но возможно, что переменные 2 $world находятся в разных областях. Попробуйте с: 

<html>

    <head>
        <script src="http://code.jquery.com/jquery-latest.js"></script>
        <script type="text/javascript" src="js/game.js"></script>
    </head>

    <body onload="init()">
        <canvas id="game" width="650" height="366" style="border: 2px solid black;"></canvas>
        <br />
        <h1> Currently in development.</h1>
        <br />
        <div id="world" value="<?php echo file_get_contents('http://url.com/testworld.txt'); ?>" />
    </body>

</html>

и посмотрите, работает ли

0 голосов
/ 24 октября 2011

Нет смысла иметь атрибут value для div. Вместо div используйте скрытый элемент textarea и поместите содержимое файла внутри него, используя что-то вроде: 

<textarea id="fileContent" style="display:none"><?php echo $world; ?></textarea>

и затем в JS: 

document.getElementById('fileContent').value;

Вернет содержимое текстовой области

...