Измените строку запроса iframe src при щелчке по выбранным параметрам

У меня есть несколько выпадающих списков на сайте, и мне нужно добавить/добавить/удалить строку запроса в зависимости от того, что выбрал пользователь. Как я могу это сделать? Вот некоторый общий код демонстрационных целей:Измените строку запроса iframe src при щелчке по выбранным параметрам

<select name="status" onchange="document.getElementById('Iframe2').src = document.getElementById('Iframe2').src + this.options[this.selectedIndex].value"> 
<option></option> 
<option value="&A=1">1</option> 
<option value="&A=2">2</option> 
</select> 


<select name="plan" onchange="document.getElementById('Iframe2').src = document.getElementById('Iframe2').src + this.options[this.selectedIndex].value"> 
<option></option> 
<option value="&FilterGarage=Right">Right</option> 
<option value="&FilterGarage=Left">Left</option> 
</select>

Так что я хотел бы произойти, скажем, пользователь выбирает опцию «1», а затем «Вправо» вариант. То, как у меня сейчас, работает отлично. Проблема возникает, когда пользователь возвращается и меняет параметр «Вправо» на «Влево». В этот момент происходит то, что это просто добавление другого параметра FilterGarage и ничего не показывает.

Я предполагаю, что мне нужно знать, как удалить значение параметра и восстановить его в зависимости от того, что пользователь выбирает каждый раз.

источник

2014-01-17 Larinx

Вы можете достичь этого с помощью чистого JavaScript. Просто добавьте id к вашим <select> элементам.

<select name="status" id="status">

<select name="plan" id="plan">

И добавить JavaScript в конце HTML <body>.

<script type="text/javascript"> 
function set_url(){ 
    status = document.getElementById("status").value; 
    plan = document.getElementById("plan").value; 
    s = url + status + plan; 
    //alert(s); 
    document.getElementById("Iframe2").src = s; 
} 
url = "http://www.google.com/search?q=JavaScript"; 
document.getElementById("status").onchange = set_url; 
document.getElementById("plan").onchange = set_url; 
</script>

ПРИМЕЧАНИЕ. Базовый URL-адрес должен храниться в переменной; как url в вышеуказанном примере.

источник

2014-01-17 03:48:35

Так что я должен удалить события onchange из операторов select, поскольку они находятся в скрипте? – Larinx

Да, вы можете удалить атрибуты onchange в элементах HTML. –

Не уверен, что я делаю неправильно. Когда я выбираю вариант, он возвращает меня к базовому URL. – Larinx

событие изменения комбо, затем вы изменяете ссылку href в зависимости от выбранного значения. В первый раз вы сохраняете base_href, чтобы не вычислять его каждый раз. Каждый раз, когда вы сохраняете измененные значения в var и добавляете две переменные в url.

var base_href="",status="",plan=""; 
$('#plan').on('change', function() { 
    plan=$(this).val(); 
    if (base_href=="") 
     base_href = $("#Iframe2").attr("src"); 
    $("#Iframe2").attr("src",base_href+plan+status); 
}); 
$('#status').on('change', function() { 
    status=$(this).val(); 
    if (base_href=="") 
     base_href = $("#Iframe2").attr("src"); 
    $("#Iframe2").attr("src",base_href+plan+status); 
});

Я делаю это с JQuery (им пишет с моим мобильным и меньше коды писать), но если вы не хотите использовать Jquery только тонкий, что изменяет это имя функции. Идея такая же!

источник

2014-01-17 03:28:44

Измените строку запроса iframe src при щелчке по выбранным параметрам

ответ

Смежные вопросы