Google App Engine的HTML下拉框
[英]HTML drop-down box with Google App Engine
问题描述
I am creating a Google App Engine web application written in Python, and I would like to create a drop down box that displays different values corresponding to pages of a book that a user could choose from. 
我正在创建一个用Python编写的Google App Engine网络应用程序，我想创建一个下拉框，以显示与用户可以选择的书页相对应的不同值。 I would like the action of the drop down box to be to direct the user to the page that corresponds to this link: 我希望下拉框的作用是将用户定向到与此链接对应的页面：
<a href='/viewpage/{{bookpage.key}}'>{{ bookpage.page }} </a>
The "bookpage" entity is passed to the html “ bookpage”实体传递给html
Thank you! 谢谢！
David 大卫
3 个解决方案
解决方案1
1 已采纳 2010-11-12 00:09:03
Use a Jump Menu . 使用跳转菜单 。 Here is a pretty straight forward implementation. 这是一个非常简单的实现。
Basically you'll just add a bit of JavaScript, and instead of writing an a tag, you'll write an option: 基本上，您将只添加一些JavaScript，而不是编写标签，而是编写一个选项：
<option value='/viewpage/{{bookpage.key}}'>{{ bookpage.page }} </option>
解决方案2
0 2010-11-12 00:24:28
What about <option value='/viewpage/{{bookpage.key.id}}'>{{bookpage.page}}</option> ? <option value='/viewpage/{{bookpage.key.id}}'>{{bookpage.page}}</option>怎么样？
I hope it's not a dumb answer. 我希望这不是一个愚蠢的答案。
解决方案3
0 2010-11-12 00:31:59
I'm not familiar with the google-app-engine but, the following javascript seems to do what you want. 我不熟悉google-app-engine，但是以下javascript似乎可以满足您的要求。 The python could generate the array variables on the server side, and then everything else would work properly. python可以在服务器端生成数组变量，然后其他所有东西都可以正常工作。 I included the hardcoded arrays so you can see what is going on, but you can replace the arrays with the python code(assuming bookpage is some kind of dictionary): 我包括了硬编码的数组，因此您可以看到发生了什么，但是您可以用python代码替换数组（假设bookpage是某种字典）：
i = 0
for bp in bookpage.keys():
print("mysites["+str(i)+"] = "+ bookpage[bp])+";"
print("sitenames["+str(i)+"] = "+sitenames[bp])+";"
i+=1
<html>
<body>
<script type="text/javascript">
var mysites= new Array();
mysites[0] = "http://www.google.com"; //Generate this line with python
mysites[1] = "http://www.bing.com"; //Generate this line with python
mysites[2] = "http://www.yahoo.com"; //Generate this line with python
var sitenames = new Array();
sitenames[0] = "Google"; //Generate this line with python
sitenames[1] = "Bing"; //Generate this line with python
sitenames[2] = "Yahoo"; //Generate this line with python
function changeLink(){
var index = document.getElementById("theselect").selectedIndex
document.getElementById("thelink").innerHTML=index;
var newlink = mysites[index];
var newstring = sitenames[index];
document.getElementById("thelink").href=newlink;
document.getElementById("thelink").innerHTML=sitenames[index];
}
</script>
<select id="theselect" onclick="changeLink()">
<option>Google</option>
<option>Bing</option>
<option>Yahoo</option>
</select>
<br />
<a id="thelink" href="http://www.google.com" > Google </a>
</body>
</html>
Clicking on the option box calls the changeLink() function, which then changes the link and the inner html of the tag. 单击选项框将调用changeLink（）函数，该函数然后更改链接和标记的内部html。
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.