带有PHP变量会话存储的JavaScript或Ajax_Php_Javascript_Jquery_Ajax

带有PHP变量会话存储的JavaScript或Ajax

php javascript jquery ajax

带有PHP变量会话存储的JavaScript或Ajax,php,javascript,jquery,ajax,Php,Javascript,Jquery,Ajax,我想为像这个网站这样的定制鞋建立在线网店http://www.shoesofprey.com/3d/designer?p=20600P4 首先，人们选择他们想要的样式，然后他们选择他们想要的颜色。我需要构建这样的脚本（无需添加到购物车）我认为，无论他们点击什么，都会存储为一个会话，然后php脚本会从该会话中选择一个图像以下是我所做的，但仍然不起作用：在index.php中 <script language='javascript'> function getXM

我想为像这个网站这样的定制鞋建立在线网店http://www.shoesofprey.com/3d/designer?p=20600P4

首先，人们选择他们想要的样式，然后他们选择他们想要的颜色。我需要构建这样的脚本（无需添加到购物车）

我认为，无论他们点击什么，都会存储为一个会话，然后php脚本会从该会话中选择一个图像

以下是我所做的，但仍然不起作用：

在index.php中

    <script language='javascript'>
    function getXMLHTTP() { //function to return the xml http object
        var xmlhttp=false;  
        try{
            xmlhttp=new XMLHttpRequest();
        }
        catch(e)    {       
            try{            
                xmlhttp= new ActiveXObject("Microsoft.XMLHTTP");
            }
            catch(e){
                try{
                xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
                }
                catch(e1){
                    xmlhttp=false;
                }
            }
        }       
        return xmlhttp;
    }

    function getpic(strURL) {       
        var req = getXMLHTTP();
        if (req) {
            req.onreadystatechange = function() {
                if (req.readyState == 4) {
                    // only if "OK"
                    if (req.status == 200) {                        
                            document.getElementById('getimg').innerHTML=req.responseText;                       
                    } else {
                        alert("There was a problem while using   XMLHTTP:\n" + req.statusText);
                    }
                }               
            }           
            req.open("GET", strURL, true);
            req.send(null);
        }
    }

function createRequestObject() {
     var ro;     
     ro = (window.ActiveXObject) ? new ActiveXObject("Microsoft.XMLHTTP") : new XMLHttpRequest();

     return ro;
}

    var http = createRequestObject();

    function sndReq(action) {
     http.open('get', 'rpc.php?action='+action);
     http.onreadystatechange = handleResponse;
     http.send(null);
}

function handleResponse() {
     if(http.readyState == 4){
          var response = http.responseText;
          var update = new Array();

          if(response.indexOf('|') != -1) {
               update = response.split('|');
               document.getElementById(update[0]).innerHTML = update[1];
          }
     }
}
    </script>
    <table>
    <tr>
        <td>
            <a href="javascript:sndReq('top')">[TOP]</a>
            <a href="javascript:sndReq('bottom')">[BOTTOM]</a>

        </td>
        <td>
            <div id="getimg" style="width:600px;height:450px;border:1px solid #ccc;border-radius:10px;">
                <img src="img/polos.jpg">
            </div>
        </td>
        <td>
            <div id="foo">
            <label><input name="color" type="radio" value="black"> black </label><br/><br/>
            <label><input name="color" type="radio" value="blue"> blue </label><br/><br/>
            <label><input name="color" type="radio" value="brown"> brown </label><br/><br/>
            <label><input name="color" type="radio" value="red"> red </label><br/><br/>
            </div>
        </td>
    </tr>
    </table>

switch($_REQUEST['action']) {
     case 'top':
          /* do something */
          session_start();
          // store session data
          $_SESSION['top']="t";

          echo "foo|"?>
            <label><input name="color" type="radio" value="1" onChange="getpic('http://localhost/distrokl/img.php?tcl='+this.value)"> blue </label><br/><br/>
            <label><input name="color" type="radio" value="2" onChange="getpic('http://localhost/distrokl/img.php?tcl='+this.value)"> brown </label><br/><br/>
            <label><input name="color" type="radio" value="3" onChange="getpic('http://localhost/distrokl/img.php?tcl='+this.value)"> red </label><br/><br/>
          <?;
          break;

    case 'bottom':
          /* do something */
          session_start();
          // store session data
          $_SESSION['bottom']="b";

          echo "foo|"?>
            <label><input name="color" type="radio" value="1" onChange="getpic('http://localhost/distrokl/img.php?bcl='+this.value)"> blue </label><br/><br/>
            <label><input name="color" type="radio" value="2" onChange="getpic('http://localhost/distrokl/img.php?bcl='+this.value)"> brown </label><br/><br/>
            <label><input name="color" type="radio" value="3" onChange="getpic('http://localhost/distrokl/img.php?bcl='+this.value)"> red </label><br/><br/>
          <?;
          break;
}

**and in img.php**

    session_start();
    $tcl = $_REQUEST['tcl'];
    $_SESSION['tcl']=$tcl;

    $bcl = $_REQUEST['bcl'];
    $_SESSION['bcl']=$bcl;

    $top = $_SESSION['top'];
    $bottom = $_SESSION['bottom'];

    $topcl = $_SESSION['tcl'];
    $botcl = $_SESSION['bcl'];

                echo "<img src='img/".$top.$topcl.$bottom.$botcl".jpg'><br/>";


函数getXMLHTTP（）{//返回xml http对象的函数
var xmlhttp=false；
试一试{
xmlhttp=新的XMLHttpRequest（）；
}
第（e）款{
试试{
xmlhttp=新的ActiveXObject（“Microsoft.xmlhttp”）；
}
捕获（e）{
试一试{
xmlhttp=新的ActiveXObject（“Msxml2.xmlhttp”）；
}
渔获物（e1）{
xmlhttp=false；
}
}
}       
返回xmlhttp；
}
函数getpic（strURL）{
var req=getXMLHTTP（）；
如果（请求）{
req.onreadystatechange=函数（）{
如果（req.readyState==4）{
//只有在“OK”的情况下
如果（请求状态==200）{
document.getElementById（'getimg'）。innerHTML=req.responseText；
}否则{
警报（“使用XMLHTTP:\n“+req.statusText时出现问题”）；
}
}               
}           
请求打开（“获取”，strURL，true）；
请求发送（空）；
}
}
函数createRequestObject（）{
var ro；
ro=（window.ActiveXObject）？新建ActiveXObject（“Microsoft.XMLHTTP”）：新建XMLHttpRequest（）；
返回ro；
}
var http=createRequestObject（）；
功能sndReq（动作）{
open（'get'，'rpc.php？action='+action）；
http.onreadystatechange=handleResponse；
http.send（空）；
}
函数handleResponse（）{
如果（http.readyState==4）{
var response=http.responseText；
var update=新数组（）；
if（response.indexOf（“|”）！=-1）{
update=response.split（“|”）；
document.getElementById（更新[0]）。innerHTML=update[1]；
}
}
}
黑色


蓝色


棕色


红色

rpc.php中的

    <script language='javascript'>
    function getXMLHTTP() { //function to return the xml http object
        var xmlhttp=false;  
        try{
            xmlhttp=new XMLHttpRequest();
        }
        catch(e)    {       
            try{            
                xmlhttp= new ActiveXObject("Microsoft.XMLHTTP");
            }
            catch(e){
                try{
                xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
                }
                catch(e1){
                    xmlhttp=false;
                }
            }
        }       
        return xmlhttp;
    }

    function getpic(strURL) {       
        var req = getXMLHTTP();
        if (req) {
            req.onreadystatechange = function() {
                if (req.readyState == 4) {
                    // only if "OK"
                    if (req.status == 200) {                        
                            document.getElementById('getimg').innerHTML=req.responseText;                       
                    } else {
                        alert("There was a problem while using   XMLHTTP:\n" + req.statusText);
                    }
                }               
            }           
            req.open("GET", strURL, true);
            req.send(null);
        }
    }

function createRequestObject() {
     var ro;     
     ro = (window.ActiveXObject) ? new ActiveXObject("Microsoft.XMLHTTP") : new XMLHttpRequest();

     return ro;
}

    var http = createRequestObject();

    function sndReq(action) {
     http.open('get', 'rpc.php?action='+action);
     http.onreadystatechange = handleResponse;
     http.send(null);
}

function handleResponse() {
     if(http.readyState == 4){
          var response = http.responseText;
          var update = new Array();

          if(response.indexOf('|') != -1) {
               update = response.split('|');
               document.getElementById(update[0]).innerHTML = update[1];
          }
     }
}
    </script>
    <table>
    <tr>
        <td>
            <a href="javascript:sndReq('top')">[TOP]</a>
            <a href="javascript:sndReq('bottom')">[BOTTOM]</a>

        </td>
        <td>
            <div id="getimg" style="width:600px;height:450px;border:1px solid #ccc;border-radius:10px;">
                <img src="img/polos.jpg">
            </div>
        </td>
        <td>
            <div id="foo">
            <label><input name="color" type="radio" value="black"> black </label><br/><br/>
            <label><input name="color" type="radio" value="blue"> blue </label><br/><br/>
            <label><input name="color" type="radio" value="brown"> brown </label><br/><br/>
            <label><input name="color" type="radio" value="red"> red </label><br/><br/>
            </div>
        </td>
    </tr>
    </table>

switch($_REQUEST['action']) {
     case 'top':
          /* do something */
          session_start();
          // store session data
          $_SESSION['top']="t";

          echo "foo|"?>
            <label><input name="color" type="radio" value="1" onChange="getpic('http://localhost/distrokl/img.php?tcl='+this.value)"> blue </label><br/><br/>
            <label><input name="color" type="radio" value="2" onChange="getpic('http://localhost/distrokl/img.php?tcl='+this.value)"> brown </label><br/><br/>
            <label><input name="color" type="radio" value="3" onChange="getpic('http://localhost/distrokl/img.php?tcl='+this.value)"> red </label><br/><br/>
          <?;
          break;

    case 'bottom':
          /* do something */
          session_start();
          // store session data
          $_SESSION['bottom']="b";

          echo "foo|"?>
            <label><input name="color" type="radio" value="1" onChange="getpic('http://localhost/distrokl/img.php?bcl='+this.value)"> blue </label><br/><br/>
            <label><input name="color" type="radio" value="2" onChange="getpic('http://localhost/distrokl/img.php?bcl='+this.value)"> brown </label><br/><br/>
            <label><input name="color" type="radio" value="3" onChange="getpic('http://localhost/distrokl/img.php?bcl='+this.value)"> red </label><br/><br/>
          <?;
          break;
}

**and in img.php**

    session_start();
    $tcl = $_REQUEST['tcl'];
    $_SESSION['tcl']=$tcl;

    $bcl = $_REQUEST['bcl'];
    $_SESSION['bcl']=$bcl;

    $top = $_SESSION['top'];
    $bottom = $_SESSION['bottom'];

    $topcl = $_SESSION['tcl'];
    $botcl = $_SESSION['bcl'];

                echo "<img src='img/".$top.$topcl.$bottom.$botcl".jpg'><br/>";

开关（$\u请求['action']））{
案例“顶部”：
/*做点什么*/
会话_start（）；
//存储会话数据
$\会话['top']=“t”；
回声“foo |”？>
蓝色


棕色


红色


蓝色


棕色


红色


你可以尝试使用jQuery。这将大大简化你的代码。你能给我一些示例吗？或者给我一些e的链接来学习那个教程-好的，thx很多链接，我会尝试，好的，我已经用javascript做了我需要的，我应该把我的代码放在这里吗？