하나의 텍스트에 텍스트 상자와 선택 상자를 결합한 값 (첫 번째 tb 값, 그 다음 sb 값)

Question

단일 텍스트 (첫 번째 tb 값, 그 다음 sb 값)에 값을 결합하여 텍스트 상자와 선택 상자를 표시하려고합니다.

<script type="text/javascript"> 
$("#text1").keyup(function() { 
$("#text2").val($("#text1").val() + $(this).find('option:selected').val()).change(); 
}); 

$("#select").keyup(function(){ 
$("#text2").val($("#text1").val() + $(this).find('option:selected').val()).change(); 
}); 
</script> 

:

<table> 
<tr> 
<td>A : </td> 
<td><input type="text" id="text1" name="customer" value=""></td> 
</tr> 
<tr><td>B :</td></tr> 
<tr> 
<td><input type="radio" onclick="change(this, 'select1000')" name="license[1]" value="1000"> 25-1000</td> 
<td><div id="select1000" style="display: none"> 
<select id="select" name="selectbox">  
<option test="l25" value="25">25</option> 
<option test="l100" value="100">100</option> 
<option test="l175" value="175">175</option> 
<option test="l250" value="250">250</option> 
<option test="l325" value="325">325</option> 
</select> 
</div> 
</td> 
</tr> 
<tr><td> ShowValue: </td> 
<td><input type="text" name="key" id="text2" value="" disabled="disabled"></td> </tr> 
</table> 

나는 내가 jQuery를 쓴이를 위해, (1 textbx 값이 다음 선택 박스를 온) ShowValuetextbox에서 텍스트 상자 A와 선택 박스 값을 모두 B를 보여주고 싶은 : 이 JSP 페이지입니다

예상되는 출력을 얻지 못하면 모든 입력 ........

Answer 1

감사합니다 여러분 모두를 결합하는 이벤트를 보장하기 위해 document.ready 사용해야하지만합니다 (TextBox2를에 댓글을 보여주는하지만)이 쓴하지만 나를 위해 노력하고 있습니다이 :

를

<script type="text/javascript"> 
    $(document).ready(function(){ 
    $("#text1").keyup(function(){ 
// $("#text2").val($("#text1").val()); 
    $("#text2").val($("#text1").val() + $(this).find('option:selected').val()).change(); 
    }); 
}); 

    $(document).ready(function(){ 
    $('select[name="selectbox"]').change(function() { 
    var selectedValue = $(this).find('option:selected').val(); 
    $('input[name="key"]').val(selectedValue); 
    $("#text2").val($("#text1").val() + $(this).find('option:selected').val()).change(); 
    }); 

}); 
</script> 

Answer 2

Dude : 코드에 약간의 실수가 있습니다. 이것으로 교체하십시오.

<script type="text/javascript"> 
$("#text1").keyup(function() { 
$("#text2").val($("#text1").val() + $("#select").find('option:selected').val()).change(); 
}); 

$("#select").change(function(){ 
$("#text2").val($("#text1").val() + $(this).find('option:selected').val()).change(); 
}); 
</script> 

텍스트 2의 .change() 이벤트를 호출하는 특별한 이유가 있습니까? 또한 간단히 $ ("# select")를 사용하여 드롭 다운에서 선택한 값을 가져올 수 있습니다.

Answer 3

<script type="text/javascript"> 

    $(document).ready(function(){  

     $('#text1').keyup(function() { 
      $('#text2').val($(this).val()+$('#select').val()); 
     }); 


    }); 
</script> 

이것은 나를 위해 작동합니다. jsfiddle에 넣으려고했으나 나에게 적합하지 않았습니다. 또한 당신은 제대로 입력을 공유

Answer 4

var sel = $("#select"), 
    txt_1 = $("#text1"), 
    txt_2 = $("#text2"); 

txt_1.on('keyup', function() { 
    txt_2.val($.trim(this.value) + sel.val()); 
}); 

sel.on('change', function() { 
    txt_2.val($.trim(txt_1.val()) + this.value); 
});