使用下拉菜单，JavaScript和PHP更改div的内容 [英] Changing the contents of a div using a dropdown, javascript and PHP
问题描述
我是一个noob，但如果你帮我找到答案，会很乐意拿一些吧）;
我有一个数组中的类别列表$ cat_array。
我想构建一个选择下拉列表，以便当我选择一个选项时，一个不同的变量被传递给一个函数。
这是我迄今为止所有：
在主文件（index.php）中，我调用一个函数：
makechoice（$ cat_array）;
这是指包含文件中的这个功能：
函数makechoice（$ cat_array）{
$ dbz = new db（）;
$ sim = new simple（）;
echo'< div class =choose-section>';
echo'< select class =selboxonchange =categoryAjaxData（\'facebook\'，\'/ includes / fancount.php\'，this.value）;>';
foreach（$ cat_array as $ cat）{
echo（'< option value ='。$ cat [0]。>'。$ cat [1]选项>'）;
}
echo'< / select>';
echo'选择一个部分';
echo'< / div>';
echo'< div id =facebook>< div class =facebook-midcut>'，showfans（$ djnames，$ djids，$ djurl），'< / div> div class =l-botcut>< / div>< / div>';
}
在includes / fancount.php中，我基本上有很多不同的变量我想通过showfans功能。
eg $ barnames，$ barids，$ barurl& $ restaurantname，$ restaurantids，$ restauranturl
showfans函数使用这些变量显示一些有关它们的数据。
这是我的JavaScript代码：
function categoryAjaxData（div，str，value）
{
var url = str +'？catid ='+ value;
ajaxData（div，url）;
}
函数ajaxData（div，str）
{
xmlHttp = GetXmlHttpObject（）;
document.getElementById（div）.innerHTML ='< center>< img src =images / loader.gif>< / center>';
if（xmlHttp == null）
{
alert（浏览器不支持HTTP请求）
return
}
var url = str;
xmlHttp.onreadystatechange = function（）{DescriptionstateChanged（div）; };
xmlHttp.open（GET，url，true）;
xmlHttp.send（null）;
}
函数DescriptionstateChanged（div）
{
if（xmlHttp.readyState == 4 || xmlHttp.readyState ==complete）
{
document.getElementById（div）.innerHTML = xmlHttp.responseText;
}
}
在MOMENT：
当前的facebook div重新加载，我可以看到装载器 - 但是我坚持如何将选择下拉列表中选择的选项链接到更改showfans（）函数中的变量。
例如
我想在下拉列表中显示Bar：
echo'< div id =facebook> ;< div class =facebook-midcut>'，showfans（$ barnames，$ barids，$ barurl），'< / div>< div class =l-botcut>< / div> < / DIV>';
我想在下拉列表中显示餐厅：
echo'< div id =facebook>< div class =facebook-midcut>'，showfans（$ restaurantnames，$ restaurantids，$ restauranturl ），'< / div>< div class =l-botcut>< / div>< / div>';
我希望有帮助！感谢提前：）
更新：
关于fancount.php，我一直在看各种不同的选择 - 但我似乎无法让任何人上班！
我想将下拉列表中的值传递给逻辑，以便根据所选的varlue，showfans（）使用某些变量，输出代码看起来类似于这对于变量的各种组合：
echo''，showfans（$ restaurantnames，$ restaurantids，$ restauranturl），'';
n00b！好的，坚持下来： - ）
你正在通过'facebook-midcut'到你的 categoryAjaxData（）函数。最终的DOM查找是否知道您是否意味着该div与该id或该div的div？如果您正在使用像jquery这样的库，那么您不需要进一步的分类就不会知道哪个节点。我猜想你正在尝试一下这个课程，所以你不能使用 getElementById（）。
您可能还需要在'includes / fancount.php'的开始添加斜杠。添加一个斜线开始这意味着该路径将引用您的站点的文档根目录，而不是您当前位置的站点内。
您是否使用某种类型的js图书馆？查看您的ajaxData函数将非常有用，因为问题可能非常好。
一个快速提示。了解何时在PHP中使用单引号和双引号。它将使您的代码更简单和更快。 echo< div id = \facebook-midcut\>; 可以写成 echo'< div id = facebook-midcut>';
我会回头看看你是否更新了我的信息，那么我可以给你更多的帮助。
更新：
我假设函数 DescriptionstateChanged（div）是实际更新div的位置，但是您不会将其传递给xmlHttp对象。这是否意味着成为全球对象？如果没有，那么你肯定需要将它传递给 DescriptionstateChanged（）函数，我建议它不应该是一个全局对象。如果 DescriptionstateChanged（）函数是实际更新div的位置，您是否可以发布此功能？
I'm a noob but will gladly take some stick for it if you help me find the answer ;)
I have a list of categories in an array $cat_array. I want to build a select drop-down so that when I select one of the options, a different variable is passed to a function.
This is what I have so far: In the main file (index.php), I call a function:
makechoice($cat_array);
This refers to this function which is in an included file:
function makechoice($cat_array) {
$dbz = new db();
$sim = new simple();
echo '<div class="choose-section">';
echo '<select class="selbox" onchange="categoryAjaxData(\'facebook\',\'/includes/fancount.php\',this.value);">';
foreach($cat_array as $cat) {
echo('<option value="'.$cat[0].'">'.$cat[1].'</option>');
}
echo '</select>';
echo 'Choose a section';
echo '</div>';
echo '<div id="facebook"><div class="facebook-midcut">',showfans($djnames, $djids, $djurl),'</div><div class="l-botcut"></div></div>';
}
In includes/fancount.php, I have basically have lots of different variables that I want to pass through the showfans function.
e.g. $barnames, $barids, $barurl & $restaurantname, $restaurantids, $restauranturl
The showfans function uses these variables to display some data about them.
This is my javascript code:
function categoryAjaxData(div,str,value)
{
var url = str+'?catid='+value;
ajaxData(div,url);
}
function ajaxData(div,str)
{
xmlHttp=GetXmlHttpObject();
document.getElementById(div).innerHTML='<center><img src="images/loader.gif"></center>';
if(xmlHttp==null)
{
alert("Browser does not support HTTP Request")
return
}
var url = str;
xmlHttp.onreadystatechange = function(){ DescriptionstateChanged(div); };
xmlHttp.open("GET",url,true);
xmlHttp.send(null);
}
function DescriptionstateChanged(div)
{
if(xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
{
document.getElementById(div).innerHTML=xmlHttp.responseText;
}
}
AT THE MOMENT: The content in the current facebook div reloads, I can see the loader - but I'm stuck with how to link the option selected in the select dropdown to changing the variables in the showfans() function.
E.g. I want "Bar" in the dropdown to show:
echo '<div id="facebook"><div class="facebook-midcut">',showfans($barnames, $barids, $barurl),'</div><div class="l-botcut"></div></div>';
I want "Restaurant" in the dropdown to show:
echo '<div id="facebook"><div class="facebook-midcut">',showfans($restaurantnames, $restaurantids, $restauranturl),'</div><div class="l-botcut"></div></div>';
I hope that helps! Thanks in advance :)
UPDATE:
With regards to fancount.php, I have been looking at various different options - but I can't seem to get any of them to work!
I want to pass the value from the dropdown into a logic so that depending on the varlue chosen, certain variables are used by showfans() and the output code looks similar to this for the various combination of variables:
echo '',showfans($restaurantnames, $restaurantids, $restauranturl),'';
n00b! OK, stick out of the way :-)
You are passing 'facebook-midcut' to your categoryAjaxData() function. Does the eventual DOM lookup know whether you mean the div with the id or the div with that class? If you're using a libray like jquery it wouldn't know which node you mean without further classification. I would guess you're trying to get the one with the class so you can't use getElementById().
You may also want to add a slash to the start of 'includes/fancount.php'. Adding a slash to the start of this means the path will reference from your site's document root rather than from your current location within the site.
Are you using some kind of js library? It would be useful to see your ajaxData function as the problem could very well be there.
A quick tip for you. Learn when to use single and double quotes in PHP. It will make your code simpler and faster. echo "<div id=\"facebook-midcut\">"; could be written as echo '<div id="facebook-midcut">';
I'll check back to see if you've updated your post with the info I've asked for then I can give you more help.
UPDATE:
I assume the function DescriptionstateChanged(div) is where the actual updating of the div happens but you never pass it the xmlHttp object. Is this meant to be a global object? If not then you definitely need to pass it to the DescriptionstateChanged() function and I would recommend that it shouldn't be a global object anyway. If the DescriptionstateChanged() function is where the actual updating of the div takes place can you post this function too?
这篇关于使用下拉菜单，JavaScript和PHP更改div的内容的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
