0

テーブルにテキストエリアがあり、クリックしてテキストエリアのサイズを変更したいと考えています。jsFiddle でスクリプトをテストしましたが、私のプロジェクトでは機能しません。スクリプトに接続して単にページに接続しましたが、成功しませんでした。jQuery が接続され、別のスクリプトが動作し、css が接続されます。

コードは次のとおりです。

$('textarea').click(function(){
    $('textarea').removeClass('active');
       $(this).addClass('textareastyle');
});

jsFiddleによると

Firefox 20.0 および jQuery 1.9.1 (縮小) でテスト済み

4

3 に答える 3

1

コードを書く場所: DOM

$(document).ready(function() {
      $('textarea').click(function(){
          $('textarea').removeClass('active');
          $(this).addClass('textareastyle');
     });    
});
于 2013-04-04T14:56:23.937 に答える
1

の代わりに.focus()andを使用.blur().click()

フィドル

$('textarea').focus(function(){
    $(this).toggleClass('textareastyle');
});
$('textarea').blur(function(){
    $(this).toggleClass('textareastyle');
});
于 2013-04-04T14:58:04.337 に答える
0

jsFiddle からコンパイルされたコードは次のとおりです。

<html>                                                                  
    <head>                                                                  
        <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>        
         <script type="text/javascript">                                         
            $(document).ready(function() {
                  $('textarea').click(function(){
                      $('textarea').removeClass('active');
                      $(this).addClass('textareastyle');
                 });    
            });                         
         </script>
         <style>
             .textareastyle{
                width: 300px; 
                height:300px; 
                position: fixed;
                margin-top:-2%;
                margin-left:30%;
                background-color:yellow;
                color: black;
            }
        </style>                                      
    </head>                                                                 
<body>                                                                  
   <textarea class="dd"></textarea>                                    
</body>                                                                 
</html>

Firefox だけでなく Chromium でも動作します。

このようなコードをメソッドでラップすることを忘れないでください。これにより$(document).ready()、DOM がロードされたときに評価されます。

初心者向けチュートリアルとAPI doc をご覧ください。

于 2013-04-04T15:00:43.017 に答える