因此，我从数据库中自动生成了一个下拉选择列表，并为每个下拉选择自动创建了一个文本区域。
以下是html/php代码：
<div class="row options-content">
<?php if ($options) { ?>
<?php foreach ($options as $option) { ?>
<?php if ($option['type'] == 'select') { ?>
<div class="form-group<?php echo ($option['required'] ? ' required' : ''); ?>">
<label class="control-label" for="input-option<?php echo $option['product_option_id']; ?>"><?php echo $option['name']; ?></label>
<select name="option[<?php echo $option['product_option_id']; ?>]" id="input-option<?php echo $option['product_option_id']; ?>" class="form-control">
<option value=""><?php echo $text_select; ?></option>
<?php foreach ($option['product_option_value'] as $option_value) { ?>
<option value="<?php echo $option_value['product_option_value_id']; ?>"><?php echo $option_value['name']; ?>
<?php if ($option_value['price']) { ?>
(<?php echo $option_value['price_prefix']; ?><?php echo $option_value['price']; ?>)
<?php } ?>
</option>
<?php } ?>
</select>
</div>
<textarea name="option-<?php echo $option['name']; ?>" rows="1" cols="50" class=""></textarea>
<?php } ?>
<?php } ?>
<?php } ?>
这是javascript：
<script>
$( "select" )
.change(function () {
var str = "";
$( "select option:selected" ).each(function() {
str += $( this ).text() + " ";
});
$( "textarea" ).text( str );
})
.change();
</script>
一切似乎都正常，只是当第一个drowdown被选中时，它会更改所有其他文本区域中的文本。。。如何仅在指定的文本区域进行更改？
我尝试了以下操作，但没有任何效果：
<script>
$( "select" )
.change(function () {
var str = "";
$( "select option:selected" ).each(function() {
str += $( this ).text() + " ";
});
$( "#option-<?php echo $option['name']; ?>" ).text( str );
})
.change();
</script>
所做的更改
►使用$(this)来标识当前更改的选择框。
$( "select" )
.change(function () {
var str = "";
$(this).find("option:selected" ).each(function() {
str += $( this ).text() + " ";
});
$(this).parent().next().text( str );
})
.change();