1

我有一个带有两个单选按钮（购买、租赁）和两个选择列表（最低价格、最高价格）的表单（如下）。

当您选择购买单选按钮时，它会调用其 JavaScript，并且下拉选项会更改为购买价格（100000 英镑、200000 英镑等）。当您选择出租单选按钮时，它再次调用它的 JavaScript 并显示出租价格（每周 250 英镑、每周 500 英镑等）。

下面的 JavaScript：

if (BuyRent=='buy') {
  document.SearchForm.MaxPrice.options[0]=new Option("Price (Max)","150000000");
  document.SearchForm.MaxPrice.options[1]=new Option("\u00A3100,000","100000");
  document.SearchForm.MaxPrice.options[2]=new Option("\u00A3200,000","200000");
  document.SearchForm.MinPrice.options[0]=new Option("Price (Min)","0");
  document.SearchForm.MinPrice.options[1]=new Option("\u00A3100,000","100000");
  document.SearchForm.MinPrice.options[2]=new Option("\u00A3200,000","200000");
} else if (BuyRent=='rent') {
  while (document.SearchForm.MaxPrice.options.length>0) {
    document.SearchForm.MaxPrice.options[0]=null;
  } 

  while (document.SearchForm.MinPrice.options.length>0) {
    document.SearchForm.MinPrice.options[0]=null
  }

  document.SearchForm.MaxPrice.options[0]=new Option ("Price (Max)","9999999");
  document.SearchForm.MaxPrice.options[1]=new Option("\u00A3250","250");
  document.SearchForm.MaxPrice.options[2]=new Option("\u00A3500","500");
  document.SearchForm.MinPrice.options[0]=new Option("Price (Min)","0");
  document.SearchForm.MinPrice.options[1]=new Option("\u00A3250","250");
  document.SearchForm.MinPrice.options[2]=new Option("\u00A3500","500");
}

有没有办法告诉每个选项在提交表单时记住它的选择？

4

2 回答 2

0

如果您要提交表单，您可能希望将值存储在hiddenHTML 元素中。

于 2010-11-17T00:35:21.187 回答
0

编辑：我可能误解了你的问题。如果您想知道如何在将选定的选项提交到服务器后记住它，这个答案不包括。

在购买和租赁之间进行更改时，请密切注意更改前选择的内容。当您改回来时，使用此信息来设置下拉菜单的selectedIndex属性。

例子：

  1. 您选择了购买并选择了 min = 100 和 max = 200。
  2. 你从买变成卖。现在 lastMin = 100 和 lastMax = 200
  3. 你换回来买。您知道最后一个值是 100 和 200，因此您相应地设置下拉列表的值

我在这里做了一个实践演示：http: //jsfiddle.net/VUBQL/。代码如下

var lastSelectedIndexes = { min: -1, max: -1 };

//The callback function when BuyRent changes
function buyRentChanged() {

    var maxPrice = document.SearchForm.MaxPrice;
    var minPrice = document.SearchForm.MinPrice;

    //Save currently selected indexes
    var selectedIndexes = {
        min: minPrice.selectedIndex,
        max: maxPrice.selectedIndex
    };

    var BuyRent = this.value

    if (BuyRent=='buy') {

        maxPrice.options[0] = new Option("Price (Max)","150000000");
        maxPrice.options[1] = new Option("\u00A3100,000","100000");
        maxPrice.options[2] = new Option("\u00A3200,000","200000");

        minPrice.options[0] = new Option("Price (Min)","0");
        minPrice.options[1] = new Option("\u00A3100,000","100000");
        minPrice.options[2] = new Option("\u00A3200,000","200000");

    }
    else if (BuyRent=='rent') {

        maxPrice.options[0]=new Option ("Price (Max)","9999999");
        maxPrice.options[1]=new Option("\u00A3250","250");
        maxPrice.options[2]=new Option("\u00A3500","500");

        minPrice.options[0]=new Option("Price (Min)","0");
        minPrice.options[1]=new Option("\u00A3250","250");
        minPrice.options[2]=new Option("\u00A3500","500");

    }

    //Set selected index to the last selected index, if it was set
    if (lastSelectedIndexes.min !== -1)
        minPrice.selectedIndex = lastSelectedIndexes.min;

    if (lastSelectedIndexes.max !== -1)
        maxPrice.selectedIndex = lastSelectedIndexes.max;


    //Save the current indexes
    lastSelectedIndexes.max = selectedIndexes.max;
    lastSelectedIndexes.min = selectedIndexes.min;

}

var radioBoxes = document.SearchForm.BuyRent
radioBoxes[0].onchange = buyRentChanged;
radioBoxes[1].onchange = buyRentChanged;
于 2010-11-17T01:57:51.117 回答