0

私はこのようなメニューを持っています：

<select>
<option value="21">option a</option>
<option value="13">option b</option>
<option value="21">option c</option>
</select>

選択しているオプションに応じて、リンクや画像の他の場所で使用するために対応する値を取得する必要があります。（クリックする前に、デフォルトのオプションからプルする必要もあります）

<img src="mysite.com/images/[valuegoeshere].jpg">
<a href="mysite.com/pages/[valuegoeshere].jpg">

これらのドロップダウンには、ページ上にいくつかの固有のバージョンがあります。

これを行う最も簡単な方法は何ですか？

4

3 に答える 3

3

以下を使用してください$(document).ready()：

function update(val) {
  $("img").attr("src", "mysite.com/images/" + val + ".jpg");
  $("a").attr("href", "mysite.com/pages/" + val + ".jpg");
}

var defaultVal = $("select").change(function () {
  update(this.value); // update <img> and <a> with the newly selected value
}).val();

update(defaultVal); // update <img> and <a> with the default value

デモ。

于 2012-09-01T19:23:40.977 に答える
2

このようにselectドロップダウンの変更イベントを処理することで選択値を取得できます

$('#yourselectid').change(function(){
currentSelectedValue=$(this).val();
alert(currentSelectedValue);
})

ワーキングフィドル

http://jsfiddle.net/yeZ3j/

更新されたフィドル

http://jsfiddle.net/yeZ3j/1/

更新されたコード：

$('select').change(function() {
    currentSelectedValue = $(this).val();
    $('img').attr('src', 'mysite.com/images/' + currentSelectedValue + '.jpg');
    $('a').attr('href', 'mysite.com/images/' + currentSelectedValue + '.jpg');

    $('body').append('<br>currentSource of img is :' + $('img').attr('src') + ' and anchor is: ' + $('a').attr('href'))
});
$(function() {
    $('select').trigger('change')
})​
于 2012-09-01T19:19:47.370 に答える
0

フォームがGETリクエストとして送信されている場合、これは簡単です。nameまた、selectに属性を与えることを忘れないでください。サーバー側で実行し、name属性が「my_name」の場合、リンクの値を変更するPHPは次のよ​​うになります。

$option = $_GET["my_name"];
$link_text = "<a href='mysite.com/pages/" . $option . ".jpg'>link</a>";
$img_text = "<img src='mysite.com/images/" . $option . ".jpg' />";
echo $img_text . "\n" . $link_text;
于 2012-09-01T19:19:46.877 に答える