如何使用選定的值和說明顯示覆選框

如果選中該複選框，則將選定值顯示爲文字如何使其顯示一個複選框，其旁邊出現文字和說明。如何使用選定的值和說明顯示覆選框

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <title></title> 
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.js"></script> 
    <script type="text/javascript" src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script> 
    <link rel="stylesheet" type="text/css" href="http://code.jquery.com/ui/1.9.1/themes/base/jquery-ui.css"> 
    <script type="text/javascript"> 
     $(document).ready(function() { 
      $(document).on("click", ":checkbox", function (e) { 
       if ($(this).is(':checked')) { 
        var checkbox = $("#sample").prepend('<div id="anotherdiv">' + $(this).attr('value') + '</div>'); 
        $("#sample").prepend(checkbox); 
       } 
       else { 
        $('#anotherdiv').remove(); 
       } 
      }); 
     }); 
    </script> 
</head> 
<body class="center" style= "margin-top: 150px;"> 
    <div id="sample"></div> 
    <input type="checkbox" name="vehicle" value="Bike">I have a bike<br> 
</body> 
</html>

來源

2014-05-22 Kiran

你想要這個http://jsfiddle.net/aamir/DtuA5/1/？只用CSS來完成。選中每個複選框以查看複選框旁邊的值。 –

我不知道如果我正確理解你的問題，但如果你想要的值屬性的值出現之前或複選框後，代碼爲：
HTML：

之前

<script type="text/javascript"> 
$(document).ready(function(){ 
    $(document).on("click", "input[type='checkbox']", function (e) { 
     var id=$(this).attr('id') 
     if($('#' + id).is(":checked")){ 
      $('<span class="anotherdiv">' + $(this).attr('value') + '</span>').appendTo('body').insertBefore($(this)) 
      }else{ 
       $(this).prev().remove(); 
      } 
     }) 

    }) 
</script>

後：

<script type="text/javascript"> 
    $(document).ready(function(){ 
     $(document).on("click", "input[type='checkbox']", function (e) { 
      var id=$(this).attr('id') 
      if($('#' + id).is(":checked")){ 
       $('<span class="anotherdiv">' + $(this).attr('value') + '</span>').appendTo('body').insertAfter($(this)) 
       }else{ 
        $(this).next().remove(); 
       } 
      }) 

     }) 
    </script>

HTML：

<input id="a"type="checkbox" name="vehicle" value="Bike"><br> 
<input id="b"type="checkbox" name="car" value="Car"><br>

如果因爲我對英語的理解不深，我不能正確理解你的問題，我爲你讓你失去時間而道歉。

來源

2014-05-22 16:51:45 Devima

如何使用選定的值和說明顯示覆選框

回答

相關問題