为什么这个Dojo代码不与其'PHP文件通信?

时间:2012-04-01 14:20:13

标签: php javascript ajax dojo

在Firebug中(使用FirePHP插件)我注意到没有与PHP文件的通信,因此没有任何反应...

这是Javascript:

// three parameters are required by Dojo!
function buildMenu(type, data, evt)
{
    var menuDOM = document.getElementById("colorselect");
    var nextColor, nextItem;

    // delete previous items in the color menu
    menuDOM.options.length = null;

    // split the data into an array of colors
    var colors = data.split(', ');

    // go through the returned array of colors
    for(var i = 0; i < colors.length; index++)
    {
        nextColor = colors[i];
        nextItem = new Option(nextColor);

        /* add the new item to the menu
         ("null" for IE5, "-1" for all other browsers) */
        try
        {
            menuDOM.add(nextItem, -1);
        }
        catch(e)
        {
            menuDOM.add(nextItem, null);
        }
    }
} // end of function buildMenu

// the function that calls bind to request data
function getColors(size)
{
    dojo.io.bind( {url: "shirtColors.php" + "?size=" + size,
                    load: buildMenu,
                    method: "GET",
                    mimetype: "text/plain"
                    } );
}<br /><br />

这是PHP:

<?php

    $shirtSize = $_GET["size"];

    // array for available colors (for each shirt size)
    $colors = array("large" => "black, yellow, green",
                    "medium" => "blue, purple, white, off-white, cream, bleached-white",
                    "small" => "orange, red, aqua, turqoise, aquamarine, light-blue");

    echo $colors[$shirtSize];
?><br /><br />

...这里是html:
(Dojo在这里链接到在线,导入Dojo io库)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>Shirt Colors</title>

        <!-- link to dojo online -->
       <script src="//ajax.googleapis.com/ajax/libs/dojo/1.7.2/dojo/dojo.js"></script>

       <!-- javascript file -->
       <script type = "text/javascript" src = "shirtColors.js"></script>

       <!-- import the dojo io library -->
       <script type = "text/javascript">
        dojo.require("dojo.io.*");
       </script>

    </head>
    <body>

       <select onchange = "getColors(this.value);">
            <option value = "large">
                large shirt
            </option>
            <option value = "medium">
                medium shirt
            </option>
            <option value = "small">
                small shirt
            </option>
       </select>

       <select id = "colorselect"></select>

    </body>
</html>

2 个答案:

答案 0 :(得分:2)

dojo.io.bind是一个非常古老的功能。

用例的新方法和支持方式是使用dojo.xhrGet或dojo.xhrPost

var deferred = dojo.xhrGet(
 {
    url: "shirtColors.php",
    content: {
      'size': size
    },
    handleAs: "text",
    load: buildMenu,
    error: function(error){
      //error handling code
    }
  }


);

请注意,查询参数将作为“内容”传递。

修改buildMenu函数:

function buildMenu (data)
{
//data contains the text string for the data returned by PHP
}

有关详细信息,请参阅http://dojotoolkit.org/reference-guide/1.7/dojo/xhrGet.html

答案 1 :(得分:1)

并更改这些文件的位置。如果shirtolors依赖于dojo.io,则不会加载。

    <!-- import the dojo io library -->
       <script type = "text/javascript">
        dojo.require("dojo.io.*");
       </script>



<!-- javascript file -->
       <script type = "text/javascript" src = "shirtColors.js"></script>