2016-07-13 2 views
1

にDIVからクラスを追加/削除します。私は以下のコードでこれを実行しようとしました:は、私は以下のような<code>DIV</code>を持ってServiceNow

$('div').removeClass("col-xs-6 form-field input_controls").addClass("col-xs-12 form-field input_controls"); 

しかし、私はというエラーを取得しています:

Uncaught TypeError: Cannot read property 'removeClass' of null.

をjQueryの私の範囲を超えているので、私は、フロントエンドの男ではありませんよ。

+1

DOM readyイベントでコードをラップします。 –

+0

問題を再現できませんでした。https://jsfiddle.net/0f2wuk9u/ – DaniP

+0

4つの等しい回答と、誰かが 'form-field input_controls'のように再度追加する場合は、すべてのクラス名を削除する必要はありません。ちょうどあなたが望むものを削除し、あなたが望むものを追加してください – DaniP

答えて

2

jQueryの正しいコードを使用していたことが判明しましたが、ServiceNowプラットフォームはjQueryを$j変数に割り当てて、他のjQueryプロトタイプと競合しません。私が正しく使用して実行できるコードは次のとおりです。

$j(document).ready(function(){ 
    if($j('div.col-xs-6.form-field.input_controls').hasClass('col-xs-6')){ 
     $j('div.col-xs-6.form-field.input_controls').removeClass('col-xs-6').addClass('col-xs-12'); 
    } 

}); 
+0

個人的には、私は '$'の代わりに 'jQuery'をどこでも使っています - もっと冗長ですが、何人かのジョーカーが' $ 'を別のものに再割り当てするまれなシナリオを扱います。あるいは、あなたのスクリプトを '$(' function($){$( "div")。show();})(jQuery); 'のように取り戻す関数でスクリプトをラップすることもできます読んで奇妙です。ここで '$ 'は文脈によって2つの異なることを意味します。 –

+0

** [ServiceNowでjQueryを使用する正しい方法]を見てください(https://jylertones.com/blog/2013/05/the-right-way-to-use-jquery-with-servicenow/)* *。 –

2

だけdocument.ready機能

$(document).ready(function(){ 
    $('div').removeClass("col-xs-6 form-field input_controls").addClass("col-xs-12 form-field input_controls"); 
}); 
2

を使用するあなたのJavaScriptが実行されたとき、あなたのDOM構造の準備ができていないようです。だから、あなたは準備ができて、イベントを追加する必要があります。あなたは、クラスのすべてを削除し、再度追加する必要はありません

$(function(){ 
    $('div').removeClass("col-xs-6 form-field input_controls").addClass("col-xs-12 form-field input_controls"); 
}); 
0

、以下で十分です:

$(function(){ 
    $('div').removeClass('col-xs-6').addClass('col-xs-12'); 
}); 

jQueryのクラスcol-xs-12を追加しますdiv要素の最後に

関連する問題