0

次のコードがあり、一種のアドレスリストを作成するのが好きです。「kies klant」をクリックすると、名前、住所、電話番号が表示されます。私が1,2,3を持っているように。それを選択するときは、3 つの選択フィールドに表示される必要があります。方法がわかりませんか?

<html> 

<head>
<script type="text/javascript" src="http://code.jquery.com/jquery.min.js"></script>
<script type="text/javascript">
    $(window).load(function(){
        $('.btnChoice').on('click', function(){
            $('#divChoices').show()
            thefield = $(this).prev()
            $('.btnselect').on('click', function(){
                theselected = $(this).prev()
                thefield.val( theselected.val() )
                $('#divChoices').hide()
            })
        })

        $('#divChoices').css({
            'border':'2px solid red',
            'position':'fixed',
            'top':'100',
            'left':'200',
            'display':'none'
        })
    });
</script>
</head>

<body>

<div class="divform">
<input type="text" id="sku1" name="sku1">
<input type="text" id="sku2" name="sku2">
<input type="text" id="sku3" name="sku3">
<button id="choice1" class="btnChoice">Kies klant</button>
</div>

<div id="divChoices">
Kies hier uw klant: 

<br>
<input type="text" name="ch1" id="ch1" value="1" >
<input type="text" id="ch2" name="ch2" value="2">
<input type="text" id="ch3" name="ch3" value="3">
<button id="btnsel2" class="btnselect">Select</button>

</div>


</body>

</html>
4

1 に答える 1

0

「選択」ボタンがクリックされたときに、メインフォームの入力で各入力を繰り返してマップすることができます。このクリック イベントは次のようになります。

$('.btnselect').on('click', function() {
     //cache this for performance
     var mainForm = $(".divform");
     //inputs in #divChoices
     var inputs = $(this).parent("div").find("input[type=text]");
     //iterate and assign
     inputs.each(function(i) {
       mainForm.find("input")[i].value = $(this).val();
     });
     //or simply do this :
     //$("#sku1").val($("#ch1").val())
     //$("#sku2").val($("#ch2").val())
     //$("#sku3").val($("#ch3").val())
     $('#divChoices').hide()
 });

ここにデモがあります:http://jsfiddle.net/hungerpain/78uw5/

于 2013-11-02T12:08:04.250 に答える