0

オプションを選択した後に選択ボックスを非表示にし、値をテキストとして配置したい。それが機能しています。次に必要なのは、テキストをクリックして選択ボックスを再度表示できるようにすることです。それは今のところ機能していません。

何をすべきか知っている人はいますか？お願いします？:-D

<a>
  <select class="trigger">
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
        <option value="4">4</option>
  </select>
</a> 
<a>
  <select class="trigger">
        <option value="a">a</option>
        <option value="b">b</option>
        <option value="c">c</option>
        <option value="d">d</option>
  </select>
</a>

<script>
$('.trigger').change( function() {
    var $tt = $(this).val();
    $(this).hide();
    $(this).parent("a").text($tt);
});
</script>
4

5 に答える 5

0

試す：

$(document).ready(function(){
    $('option').click(function(){
      var value = $(this).attr('value');
      $(this).parents('a').html(value);
    });
  });

編集:あなたの問題は、実際にはjQueryをdoc readyでラップしなかったことにあると思いますか? 私はそれを追加しましたが、ドキュメントの準備ができていれば、元の方法が機能する可能性があると思います。

于 2013-05-12T16:02:35.317 に答える
0 
$(function () {
    $('.trigger').change(function () {
        var $tt = $(this).val();
        $(this).hide();
        // Don't use .text(), that will replace the <select> with the text
        $(this).parent("a").append($("<span/>", {
            text: $tt
        }));
    });
    $("a").click(function () {
        // If the select is hidden ...
        var $select = $(".trigger:hidden", $(this));
        if ($select.length) {
            // Remove the text field ...
            $("span", $(this)).remove();
            // and show the select
            $select.show();
        }
    });
});

FIDDLE

于 2013-05-12T16:07:03.437 に答える