如何通过单击并检索ID来检索值?

时间:2014-11-01 11:02:32

标签: javascript php ajax xmlhttprequest

我想制作一个功能,允许我点击带有颜色ID的方块,作为回报我id =" retours_couleurs"包含php文件中表格中包含的颜色的句子,对不起我的英语法语

这是我的HTML代码

<fieldset class="appel">
        <code>
            Un clic simple sur le carré bleu appelle le contenu du fichier couleurs.php, en transmettant en paramètre l'ID de ce carré. La réponse du fichier appelé devra s'afficher dans l'espace prévu à cet effet (id="retour_couleurs").
        </code>
    </fieldset>
    <br />
    <fieldset class="appel">
        <div class="carre-couleurs">
            <div class="carre" id="jaune"></div>
            <div class="carre" id="rouge"></div>
            <div class="carre" id="bleu"></div>
            <div class="carre" id="vert"></div>
            <div class="clear"></div>
        </div>
        <br />
        <br />
        <fieldset class="retour">
            <legend>Contenu du fichier</legend>
            <div id="retour_couleurs"></div>
        </fieldset>
    </fieldset>

这是我的ajax功能

function appel_contenue_couleur(){
                var cM = new XMLHttpRequest();
        cM.open("POST","fichiers/couleurs.php",true);
        cM.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
    var couleur = this.id;
    var retour_couleurs = document.getElementById('retour_couleurs');
        cM.send("retour= "+couleur);
        cM.onreadystatechange = function (){
        if (cM.readyState == 4 && cM.status == 200)
        {
            retour_couleurs.innerHTML=cM.responseText;
        }
        }}

这是我的PHP代码

$_couleurs = array("jaune", "rouge", "bleu", "vert");

$_citations = array(
    "L’herbe est toujours plus verte ailleurs",
    "La terre est bleue comme une orange",
    "Le ciel est un oeuf, la terre en est le jaune",
    "Mieux vaut rester rouge cinq minutes que jaune toute la vie",
    "C'était un moustique snob. Il ne buvait que du sang bleu"
);
$couleurs = $_POST['retour'];
if (in_array($couleurs,$_couleurs)){
    for ($i=0;$i<count($_citations);$i++){
        if (in_array ($couleurs,$_citations[$i])){
            echo $_citations[$i];
        }
    }

}

2 个答案:

答案 0 :(得分:1)

如果我正确理解了您的问题,那么您无法从AJAX请求获得任何输出。这可能是因为您使用了错误的PHP函数来检查句子是否包含某个单词。

试试这个:

if (stripos($_citations[$i], $couleurs) !== false) {
    echo $_citations[$i];
}

我使用stripos因为您可能不想进行区分大小写检查。

答案 1 :(得分:0)

完整代码: 使用Javascript:

function appel_contenue_couleur(obj){


                var cM = new XMLHttpRequest();
        cM.open("POST","colors.php",true);
        cM.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
    var couleur = obj.id;

    var retour_couleurs = document.getElementById('retour_couleurs');
        cM.send("retour= "+couleur);
        cM.onreadystatechange = function (){
        if (cM.readyState == 4 && cM.status == 200)
        {
           retour_couleurs.innerHTML=cM.responseText;
        }
        }}

HTML:

 <div class="carre-couleurs">
            <div class="carre" id="jaune" onclick="appel_contenue_couleur(this);">1111111</div>
            <div class="carre" id="rouge" onclick="appel_contenue_couleur(this);">222222222</div>
            <div class="carre" id="bleu" onclick="appel_contenue_couleur(this);">33333333</div>
            <div class="carre" id="vert" onclick="appel_contenue_couleur(this);">444444444444</div>
            <div class="clear"></div>
        </div>

PHP:

$colors = array("jaune", "rouge", "bleu", "vert");
$citations = array(
    "L’herbe est toujours plus verte ailleurs",
    "La terre est bleue comme une orange",
    "Le ciel est un oeuf, la terre en est le jaune",
    "Mieux vaut rester rouge cinq minutes que jaune toute la vie",
    "C'était un moustique snob. Il ne buvait que du sang bleu"
);
$color = trim($_POST['retour']);

//echo $color;

if (in_array($color,$colors)){



   for($i=0;$i<count($citations);$i++) {

  if(stripos($citations[$i],$color)!==false) {


       echo $citations[$i].'<br>';


   }
   }
        }

它正在运行,100%,经过测试。如果需要,只需更改链接。