使用HTML下拉菜单更改链接 [英] Change Link with HTML Dropdown

问题描述

我正在尝试使用HTML下拉菜单中的值来更改Google Spreadsheet查询HTML表的位置。

I'm trying to use the values from an HTML dropdown menu to change the "where" of the Google Spreadsheet query HTML table.

以下是我的下拉菜单到目前为止：

Here's the dropdown as I have it so far:

<select>
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
</select>

我需要更改的链接看起来像这样（在iframe中）：

And the link I need it to change looks like this (inside of an iframe):

<iframe src="https://docs.google.com/spreadsheets/d/*spreadsheet key*/gviz/tq?tqx=out:html&tq=select+A,B,D,E,F,G+**where+D+contains+'*CHANGETHIS*'**&gid=2105149734" width="100%" height="200"></iframe>

基本上我需要 CHANGETHIS 等于在下拉菜单中选择

Basically I need CHANGETHIS to equal whatever is selected in the dropdown.

可能吗？

推荐答案

您可以使用javascript 。首先，您需要将ID添加到选择

You can do this using javascript. First you need to add id to the select

因此将列表更改为

<select id="myID">             <====== heres the change
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
</select>
var value = document.getElementById("myID");
var selectedString = value.options[value.selectedIndex].value;

此处 selectedString 包含要添加的值

var Url="https://docs.google.com/spreadsheets/d/*spreadsheet key*/gviz/tq?tqx=out:html&tq=select+A,B,D,E,F,G+**where+D+contains+selectedString+&gid=2105149734"

或使用 innerHTML

这篇关于使用HTML下拉菜单更改链接的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！