可以将文章内容翻译成中文,广告屏蔽插件可能会导致该功能失效(如失效，请关闭广告屏蔽插件后再试):

问题:

I have been searching for similar questions but they are a little different to what I am looking for.

Basically, this is what I am aiming to implement:

Have a first drop-down list filled with values, e.g. :

<form>
<select id="tags" name="tags">
<option value="agent" selected="selected">agent</option>
<option value="extension">extension</option>
<option value="fileversion" >fileversion</option>
<option value="pages">pages</option>
</select>

Then, in a second drop-down list, show options dependant on what was selected, for example, if agent is selected, the operators would be = or != since it is text. For fileversion there would be 4 operands, =, !=, > and <.

Lastly, there would be a third drop-down with values also dependant on the initially selected option.

For example, when agent is selected, the options would be pdf, word, excel, ppt etc. and others it would just be a text box to type in rather than exhaust all possible values.

In the end this will be used to search a database but it is a big db and the searches are too slow so I'm thinking the values for the options will be stored in an array rather than pulled directly.

As you can see, it's fairly tricky :/ any help at all is much appreciated.

Thanks, Martin

EDIT:

Found the answer for those who happen to be looking for the same answer:

<!DOCTYPE html>
<html lang="en">
<head>
<title></title>
<script type="text/javascript" src="js/jquery-1.4.2.js"></script>
<script type="text/javascript" src="js/dropdown.js"></script>
</head>
<body>
<form>
<select id="tags" name="tags">
<option value="tags" selected="selected">tags</option>
<option value="agent">agent</option>
<option value="extension">extension</option>
</select>

<select name="operands">
<option>operands</option>
</select>
</form>
</body> 
</html>

dropdown.js:

$(document).ready(function() {
$tags = $("select[name='tags']");
$operands = $("select[name='operands']");

$tags.change(function() {

if ($(this).val() == "agent") {
$("select[name='operands'] option").remove();
$("<option>=</option>").appendTo($operands);
$("<option>!=</option>").appendTo($operands);
}

if ($(this).val() == "extension") 
{
$("select[name='operands'] option").remove();
$("<option>.pdf</option>").appendTo($operands);
$("<option>.doc</option>").appendTo($operands);
}

if ($(this).val() == "tags") 
{
$("select[name='operands'] option").remove();
$("<option>operands</option>").appendTo($operands);
}

});
});

回答1:

try something like this, a data object filled with the corresponding data..

var data = {
  agent: [
    ["=", "!="], //values that are shown in 1st dropdown when agent is selected
    ["a", "b"] //values that are shown in 2nd dropdown when agent is selected
  ]
  extension: [
    ["pdf", "doc"], //values that are shown in 1st dropdown when extension is selected
    ["c", "d"] //values that are shown in 2nd dropdown when extension is selected
  ]
}

and for the HTML

<select id="tags" name="tags">
  <option value="agent" selected="selected">agent</option>
  <option value="extension">extension</option>
  <option value="fileversion" >fileversion</option>
  <option value="pages">pages</option>
</select>

<select id="dropdown2" name="dropdown2">
</select>

<select id="dropdown3" name="dropdown3">
</select>

Now listen for changes on the tags dropdown and get the options from the data object (example using jquery)

$("#tags").change(function() {
  setDropDown1(data[$(this).val()][0]);
  setDropDown2(data[$(this).val()][1]);
});

pass the data to a function like this to create the dropdown options

function setDropDown1(data) {
  $("#dropdown1").html(""); //clear options
  for (var i = 0; i < data.length; i++) {
    $("#dropdown1").append("<option value='" + data[i] + "'>" + data[i] + "</option>");
  }
}

回答2:

var selectionObject = {
agent = ["=","!="],
fileversion = ["=","!=",">","<"],
...
}

$('form select#tags').click(function(){
comboBoxSelection = $(this).val();
secondDropDownvalues = selectionObject[comboBoxSelection];
....
});

In pseudo code should be something like that