如何在js中以新td显示select？

Question

我需要js在class=“contentsr”中显示选择的id，显示class=“contentsr”中的所有代码：我们需要在第一类中显示第一个SELECT=“contentsr”，第二个SELECT在第二类=“contentsr”。

html和javascript代码如下：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
<tr>
<td>
 <select name="jens_id[]" class="jens_id" required="">
<option ></option>
<option >1</option>
<option >2</option>
</select><span class="contentsr" ></span>
</td>
</tr>
<tr>
<td>
<select name="jens_id[]" class="jens_id" required="">
<option ></option>
<option >1</option>
<option >2</option>
</select><span class="contentsr" ></span> </td>
</tr>
</table>
<script>
$(document).ready(function() {
$('.jens_id').change(function() {
 statteId = $(this).val(); // or this.value
$('.contentsr').text(statteId).val();
 });
 });

Answer 1

Your class is next to your select element so you can use next() to get next span of selected element

<script>
$(document).ready(function() {
$('.jens_id').change(function() {      
 statteId = $(this).val(); // or this.value
 $(this).next().text(statteId);

 });
 });
</script>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
<tr>
<td>
 <select name="jens_id[]" class="jens_id" required="">
<option ></option>
<option >1</option>
<option >2</option>
</select><span class="contentsr" ></span>
</td>
</tr>
<tr>
<td>
<select name="jens_id[]" class="jens_id" required="">
<option ></option>
<option >1</option>
<option >2</option>
</select><span class="contentsr" ></span> </td>
</tr>
</table>

<script>
$(document).ready(function() {
$('.jens_id').change(function() {      
 statteId = $(this).val(); // or this.value
 $(this).next().text(statteId);

 });
 });
</script>

</div>