javascript - jq 드롭다운 상자 값을 표시하는 방법-PHP 튜토리얼-php.cn

javascript - jq 드롭다운 상자 값을 표시하는 방법

WBOY

풀어 주다： 2016-09-06 08:57:09

원래의

882명이 탐색했습니다.

이런 걸 쓰고 싶어요
값을 선택하면 현재 선택된 값이 div에 표시되는 드롭다운 상자가 있습니다. 다른 드롭다운 옵션을 전환하면 div의 값도 변경됩니다.

제 코드인데 작동하지 않습니다. 무슨 일이야?

<code><body>
    <script src="http://keleyi.com/keleyi/pmedia/jquery-1.9.1.min.js"></script>

<select id="s">
    <option value="1">Option 1</option>
    <option value="2">Option 2</option>
    <option value="3">Option 3</option>
    <option value="4">Option 4</option>
</select>
    <script type="text/javascript">
        $('#k').on('change', function()
{
    document.write($("#s").val());
    
});
    </script>
    <div id="k"></div>
</body>value值
我想在div#k中显示当前选中的下拉选项</code>

로그인 후 복사

무슨 일인지 실례합니다

답글 내용:

제 코드인데 작동하지 않습니다. 무슨 일이야?

<code><body>
    <script src="http://keleyi.com/keleyi/pmedia/jquery-1.9.1.min.js"></script>

<select id="s">
    <option value="1">Option 1</option>
    <option value="2">Option 2</option>
    <option value="3">Option 3</option>
    <option value="4">Option 4</option>
</select>
    <script type="text/javascript">
        $('#k').on('change', function()
{
    document.write($("#s").val());
    
});
    </script>
    <div id="k"></div>
</body>value值
我想在div#k中显示当前选中的下拉选项</code>

로그인 후 복사

무슨 일인지 실례합니다

<code><!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <script src="http://keleyi.com/keleyi/pmedia/jquery-1.9.1.min.js"></script>
    <script>
    $(document).ready(function(){
        $('#s').on('change', function(){
            $("#k").text($("#s").val())
        })
    })
    </script>
</head>
<body>
    <select id="s">
        <option value="1">Option 1</option>
        <option value="2">Option 2</option>
        <option value="3">Option 3</option>
        <option value="4">Option 4</option>
    </select>
    
    <div id="k"></div>
</body>
</html></code>

로그인 후 복사

당신의 논리는 놀랍습니다!
s의 값을 변경하려면 이벤트를 k에 바인딩합니까?

각 옵션을 사용하고 이벤트를 각 옵션에 바인딩하세요. 이것은 효과적일 것이다.

<code><script type="text/javascript">

    $('#s').each(function (i, j){
        
        $(j).click(function(){
            value = $(j).val();
            $("#k").text(value);
        })
    })
    
</script></code>

로그인 후 복사

다음을 시도해 보세요.

<code>$('#s').change(function(){
  $('#k').text($(this).find(':selected').text());
});</code>

로그인 후 복사

s가 변경되면 k의 텍스트는 s에서 현재 선택된 항목의 텍스트가 됩니다.
휴대폰번호, 몰라서 죄송해요!

`$(function(){$('#s').on('change',function(){
$('#s :checked').val();
}) ;})`

Native Select는 구현할 수 없나요?