2016-05-05 15 views
0

私はjQueryのチェーンを実装しています - ミカTuupolaのチェーン・プラグインを使用して - (パーシャルのform_forにネストを使用して)私のレールプロジェクトで、動的に連鎖属性を変更する必要があります。のjQuery/Javascriptの置換「構文エラー、認識できない式」

置換せずに動作するコード:

var t2 = new Date().getTime(); 
var A1 = ".employee_title_1A_" + t2; 
var B2 = ".employee_title_2B_" + t2; 

$(".employee_title_2").remoteChained({ 
    parents : ".employee_title_1", 
    url : "titles/employee_title_2", 
    loading : "Loading...", 
    clear : true 
}); 

属性が置換されている.employee_title_1.employee_title_2です

ルビーでは、datetimeを追加して変数の名前を付けています。ここで

は、私はオンザフライで置換するために使用しているコードです:

$(`"${B2}"`).remoteChained({ 
    parents : `"${A1}"`, 
    url : "titles/employee_title_2", 
    loading : "Loading...", 
    clear : true 
}); 

このエラーがスローされますどの:「」

Uncaught Error: Syntax error, unrecognized expression: 
    ".employee_title_2B_1462463848339" 

問題が有力であるように思われますそれが問題だとすれば、どのように私はそれをエスケープするのですか?エラーメッセージSyntax error, unrecognized expressionを調べると、「文字列が(「<」文字よりも小さい文字で始まる場合にのみ文字列がHTMLであるとみなされます)」という疑問が提起されます。残念ながら、このソリューションの実装方法はわかりません。私のjavascriptのスキルは弱いです!ちなみに

新しいネストされたフォームフィールドがページにご協力を事前に

感謝を追加されると、new Date().getTime();が日付形式ではありませんが、それは私の目的のために働く、すなわち、それが増加します。

+0

.jsファイルまたは.js.erbテンプレートで「オンザフライ」置換に使用しているコードはありますか?それとも全く別のもの? –

+0

html.erb(ROR)ファイルの末尾にある「

1

バックティック( ``)構文はJavaScriptが新しく、Rubyは補間された文字列を提供する方法と同様のテンプレート機能を提供します。例えば、このJavascriptコード:

var who = "men"; 
var what = "country"; 
var famous_quote = `Now is the time for all good ${who} to come to the aid of their #{what}`; 

はこのRubyコードとまったく同じように補間されます。

who = "men" 
what = "country" 
famous_quote = "Now is the time for all good #{who} to come to the aid of their #{what}" 

をどちらの場合も、引用符は読書、"Now is the time for all good men to come to the aid of their country"を終わります。同様の機能、構文が少し異なります。

jQueryセレクタに移動すると、それらの指定方法に柔軟性があります。それはあなたが変数でjQueryのセレクタの名前を格納し、それらを使用することができることを意味するので、

var my_class_name = ".my_class"; 
$(my_class_name).show(); 

これは素晴らしいことです。たとえば、このコード:

$(".my_class").show(); 

は、このコードと機能的に同等です文字列リテラルを必要とするのではなく、この例のようにコンポーネントからビルドすることもできます。

var mine_or_yours = (user_selection == "me") ? "my" : "your"; 
var my_class_name = "." + mine_or_yours + "_class"; 
$(my_class_name).show(); 

これは本質的に動作しようとしている動作です。 (補間とダイナミックなjQueryのセレクタ)2つの機能を使用して、あなたがこれを持っている:

文字列の補間によって、このコードを生成します
$(`"${B2}"`).remote_chained(...); 

$("\".employee_title_2B_1462463848339\"").remote_chained(...); 

正しくされていません。実際には、文字列の値に二重引用符が埋め込まれているため、jQueryのエラーメッセージの原因となります。 jQueryは、セレクタに渡す値を囲む余分な二重引用符について特に不平を言います。

$(".employee_title_2B_1462463848339").remote_chained(...); 

のいずれか、このように書くことができます:そうのように、はるかに簡単かつ移植性

$(`${B2}`).remote_chained(...); 

かを、:

は、あなたが実際に欲しいのは、このことと同じです

$(B2).remote_chained(...); 

この小さなサンプルコードを試して、自分と同値であることを証明してください:

if (`${B2}` == B2) { 
    alert("The world continues to spin on its axis..."); 
} else if (`"${B2}"` == B2) { 
    alert("Lucy, you've got some 'splain' to do!"); 
} else { 
    alert("Well, back to the drawing board..."); 
} 

したがって、元の文字列と同等の補間値を設定しました。また、リテラルjQueryセレクタと動的セレクタの同等性を確立しました。さて、それは、元のコードのコンテキストで一緒に技術を配置する時間です。

ではなく、補間バージョンのこれを試してみてください:

$(B2).remoteChained({ 
    parents : A1, 
    url : "titles/employee_title_2", 
    loading : "Loading...", 
    clear : true 
}); 

は、我々はすでに作品のよう$(B2)は、完全に受け入れ動的なjQueryのセレクタであることを知っています。 remoteChainedハッシュのparentsキーに渡される値は単に文字列を必要とし、A1は既に請求書に適合しているので、その場合に補間を導入する必要はありません。

現実的には、この問題は何も連鎖に関連していません。それはちょうど失敗しているステートメントに含まれることがあります。つまり、失敗したコード(ビルドとjQueryセレクタの使用)を簡単に分離でき、デバッグがはるかに簡単になります。

ECMAScriptバージョン6ではJavascriptの構文が昨年だけ成文化されているため、サポートはまだ混在しています。ブラウザのサポートを確認して、確実に使用できることを確認してください。

+0

説明と例をありがとうございます。私は、あなたがandirc(下)に私の応答を読んでいないと思う。あなたの答えは正しい補間/置換ですが、それは私がMika TuupolaのjQuery Chainedプラグインとの連鎖作業をするために必要なものではありません。 – user3763682

+0

私はこの回答を投稿する前にコメントを読んだ。あなたは、あなたの "コードは両方の 'が必要だと言った。前述のエラーを防ぐために ""(二重引用符)を使用します。私の答えは、Javascriptの補間を削除すると、受け取っているjQueryエラーを修正する理由を説明することに焦点を当てていました。 jQueryセレクタ内で「キャッチされていないエラー:構文エラー、認識できない式」エラーが発生していて、簡単に再現できます。私が記述したようにセレクタを修正したら、少なくともChainedを動作させることになります。 –

関連する問題