質問する
2504 次
3 に答える
2
<select id="your_select">
<option>Option 1</option>
<option>Option 2</option>
<option>Option 3</option>
<option>Option 4</option>
<option>Option 5</option>
<option>Option 6</option>
<option>Option 7</option>
<option>Option 8</option>
<option>Option 9</option>
</select>
<span id="slave" class="option0">option0</span>
$('#your_select').on('change', function() {
var value = $('option:selected', this).text().replace(/Option\s/, '');
$('#slave').removeClass().addClass('option' + value).text('option' + value)
});
次のような場合select
:
<select id="your_select">
<option value="option1">Option 1</option>
<option value="option2">Option 2</option>
<option value="option3">Option 3</option>
<option value="option4">Option 4</option>
<option value="option5">Option 5</option>
<option value="option6">Option 6</option>
<option value="option7">Option 7</option>
<option value="option8">Option 8</option>
<option value="option9">Option 9</option>
</select>
<span id="slave" class="option0">option0</span>
それで
$('#your_select').on('change', function() {
var value = this.value;
$('#slave').removeClass().addClass(value).text(value)
});
于 2012-05-27T10:59:29.670 に答える
1
$('select').change(function(){
var val = $(this).val();
alert(val);
$('span').removeAttr('class').addClass('option' + val);
})
于 2012-05-27T10:15:08.833 に答える
1
HTML:
<select id="master">
<option>Content 1</option>
<option>Content 2</option>
<option>Content 3</option>
<option>Content 4</option>
<option>Content 5</option>
<option>Content 6</option>
<option>Content 7</option>
</select>
<span id="slave">option0</span>
jQuery:
$('#master').change(function() {
var selected = $(this).val();
$('#slave').removeClass().addClass('option' + selected);
});
CSS:
.option0 {
background-color: red;
}
.option1 {
background-color: green;
}
.option2 {
background-color: brown;
}
.option3 {
background-color: yellow;
}
.option4 {
background-color: blue;
}
...
ここで実際の例を参照してください
別の方法として、オプション タグの間にコンテンツを配置する場合は、カスタム属性「data-position」を適用し、次の jQuery を使用します。
$('#master').change(function() {
var selected = $('#master option:selected').attr('data-position');
alert(selected);
$('#slave').removeClass().addClass('option' + selected);
});
ここで更新されたライブの例を参照してください
于 2012-05-27T10:16:51.400 に答える