如何在HTML / JavaScript页​​面中插入一个PHP下拉 [英] How to insert a PHP dropdown in a HTML / Javascript page

问题描述

好吧，这是我的第二个帖子，请接受我是一个完整的新手，乐于学习，花费很多时间trauling各个网站寻找答案，而且我差点的地方，我需要是（至少在该位）。

Ok, this is my second post, and PLEASE accept that I am a complete newbie, willing to learn, spending many hours trauling various sites for answers, and I've almost got to where I need to be (at least for this bit).

我有一个网页，其中有JavaScript函数，它们共同产生nubmer一个谷歌地图与各种线路等使用谷歌地图API。

I have a web page which has a nubmer of javascript functions that work together to generate a Google Map with various lines etc. using the google maps API.

我也有一个MySQL数据库，在一些信息。 我创建了一个PHP脚本动态生成与数据库中的信息一个下拉框。 （这一点似乎做工精细） - http://www.bournvilleconservatives.com/temp/select .PHP

I also have a MySQL Database with some information in. I have created a PHP script to dynamically generate a dropdown box with information from the database. (and that bit seems to work fine) - http://www.bournvilleconservatives.com/temp/select.php

我现在需要做的就是那个下拉框出现在HTML / Javascript的网页，我已经有了，这样，当用户从列表中选择的东西，它调用与选定值的JavaScript函数。

What I now need to do is get that dropdown box to appear in the HTML / Javascript page that I already have, so that when a user selects something from the list, it calls a javascript function with the value selected.

我被告知我需要使用AJAX拉框，并使用innerHTML来显示它，但我真的不知道怎么的，可以做的类似的东西来帮助我对我的方式的一个例子。

I'm told I need to use AJAX to pull the box in, and use innerhtml to display it, but I really have no idea how, and could do with an example of something similar to help me on my way.

我会把PHP的HTML页面，但该页面实际上是包裹在一个Joomla！包装，所以其所有的相当复杂的。

I would put the PHP in the html page, but that page is actually wrapped up in a Joomla! wrapper, so its all rather complicated.

在此先感谢。

推荐答案

jQuery的解决方案

如果你愿意使用 jQuery的，它会帮助你访问DOM，使Ajax调用和东西很多。让我给你在jQuery的一个解决方案：

If you are willing to use jQuery, it will help you a lot with accessing the DOM, making Ajax calls and stuff. Let me give you a solution in jQuery:

首先，把一个div到HTML（这将存储您的选择框）：

First, put a div into HTML (this will store your select box):

<div id="i_want_my_select_here"></div>

然后把这个code在你的HTML结束前＆LT; /身体GT;

<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
<script type="text/javascript">
  $(document).ready(function() {
    $('#i_want_my_select_here').load('/temp/select.php');
  });
</script>

在第一个脚本标记，我们有来自谷歌的CDN的jQuery库。第二，我们写的Javascript / jQuery的code。该 .load（）功能可以很容易地使一个Ajax调用并加载响应到一个HTML元素。

In the first script tag, we include the jQuery library from Google's CDN. In the second, we write our Javascript/jQuery code. The .load() function makes it easy to make an Ajax call and load the response into an HTML element.

您可以看到这是比所有的code。在我其他的答案变得容易多了。）

You can see this is much easier than all that code in my other answer :).

这篇关于如何在HTML / JavaScript页​​面中插入一个PHP下拉的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！