-2

我想根据客户从我提供给他们的下拉菜单中的选择向他们提供示例 PDF。

我创建了一个jsfiddle来尝试向您展示我想要实现的目标。

我的 HTML：

<p>Please select from the options below to view a sample Investment Cost Analysis:</p>
<p>&nbsp;</p>
<p>
  <label for="type">* Combined Income:</label>
  <select name="income" id="income">
    <option selected="selected">- Please Select -</option>
    <option value="$30,000 - $80,000">$30,000 - $80,000</option>
    <option value="$80,000 - $180,000">$80,000 - $180,000</option>
    <option value="$180,000+">$180,000+</option>
  </select>
</p>
<p>
<label for="type">* Property Type:</label>
<select name="type" id="type">
  <option selected="selected">- Please Select -</option>
  <option value="house">House</option>
  <option value="unit">Apartment / Unit</option>
</select>
</p>
<p>
<label for="price">* Property Price:</label>
<select name="price" id="price">
  <option selected="selected">- Please Select -</option>
  <option value="$350,000">$350,000</option>
  <option value="$400,000">$400,000</option>
  <option value="$450,000">$450,000</option>
  <option value="$500,000">$500,000</option>
</select>
</p>
<p>
  <input type="submit" name="show" id="show" value="Show Sample" />
</p>

如何使它根据选择的选项显示正确的文件？我还想确保在 Show Sample 按钮起作用之前选择了所有 3 个选项。

我知道这需要一些 JavaScript，但这就是我卡住的地方。我不知道从哪里开始使用 JavaScript。

4

3 回答 3

1

更改下拉功能时更改链接的href

$("#mydropdown").change(function(e) {

var dropdown value = $("#mydropdown").value();

//switch condition 
if(){
$("mylink").attr("href", "your file path"); 
//TODO 
}else if (){

}

 });
于 2013-01-29T06:45:00.967 回答
0

试试这个：http: //jsfiddle.net/9hqKN/2/

$('#show').hide();

$('select').change(function () {
  var income = $('#income').val();
  var type = $('#type').val();
  var price = $('#price').val();

  if (income == 0 || type == 0 || price == 0) {
    $('#show').hide();
  } else {
    $('#show').show();
  }
});

有一个编辑我在每个中都赋予0了价值all first option<select>

于 2013-01-29T06:56:38.560 回答
0

这是一个非常简单的例子。

更新： 显然，如果用户的浏览器没有 PDF 查看器，这将强制打开下载窗口。

HTML：

<select id="pdfs">
    <option value="http://example.com/docs1.pdf">PDF 1</option>
    <option value="http://example.com/docs2.pdf">PDF 2</option>
    <option value="http://example.com/docs3.pdf">PDF 3</option>
</select>

JS：

var selectElem = document.getElementById('pdfs');

selectElem.onchange = function() {
  window.location = selectElem[selectElem.selectedIndex].value;
};
于 2013-01-29T06:45:57.993 回答