Y compris javascript en ligne utilisant content_for in rails

J'utilise content_for et yeild pour injecter des fichiers javascript en bas de ma mise en page mais je me demande quelle est la meilleure pratique pour inclure le javascript en ligne. Plus précisément, je me demande où mettre la déclaration de type de script:Y compris javascript en ligne utilisant content_for in rails

<% content_for :javascript do %> 
    <script type="text/javascript"> ... </script> 
<% end %>

<% content_for :javascript do %> ... <% end %> 
    <script type="text/javascript"> 
    <%= yield :javascript %> 
    </script> 
<% end %>

J'utilise la première option maintenant et se demander si elle est mauvaise pour inclure plusieurs

...

déclarations dans une vue. Parfois, j'ai des partiels qui mènent à cela.

Source

2010-03-17 TenJack

Quel est votre cas d'utilisation? Est-ce js généré dynamiquement? – jonnii

Quel serait un exemple de js généré dynamiquement? Parfois, j'ai besoin de passer des variables d'une vue à une fonction javascript au moment de l'exécution. – TenJack

Je préfère de beaucoup avoir l'apparence de rendement de la mise en page comme ceci:

<html> 
    <!-- other stuff --> 
    <body> 
    <!-- other stuff --> 
    <%= yield :javascript %> 
    </body> 
</html>

Ensuite, dans une vue, vous pouvez écrire:

<% content_for :javascript do %> 
    <script type='text/javascript'> 
    function doMagic() { 
     //Mind-blowing awesome code here 
    } 
    </script> 

<% end %> 

<!-- More view Code --> 

<%= render :partial => "sub_view_with_javascript" %>

Et dans le _sub_view_with_javascript.html.erb partiel, vous pouvez également écrire:

<% content_for :javascript do %> 
    <script type='test/javascript'> 
    function DoMoreMaths() { 
     return 3+3; 
    } 
    </script> 
<% end %>

Mon raisonnement pour cette approche est que le rendement et content_for sont différents fichiers nt. Il n'est pas DRY de mettre le tag de script pour chaque contenu_for mais il permet à la syntaxe highlighter de reconnaître le changement de langue dans chaque fichier et m'aide là-bas.

Si vous avez plusieurs contenus_pour des appels dans un seul fichier vers le même symbole (dans notre cas,: javascript), je considérerais de les consolider tous vers le haut, mais c'est parfait pour les partiels.

Et HTML est parfaitement heureux d'avoir autant de blocs de script que vous le souhaitez. Le seul gotcha possible est de travailler avec le code dans les outils de développement comme firebug, il faut un peu plus de temps pour trouver le bon bloc de script pour votre fonction. Cela ne se produit que lorsque j'ai besoin de définir un point d'arrêt javascript pour déboguer.

Source

2010-03-17 18:14:44 Tilendor

J'ai lu qu'il est préférable de mettre le javascript à la fin de votre mise en page juste avant le tag afin que la page se charge plus rapidement. Voulez-vous dire utiliser l'élément ? – TenJack

Je n'ai pas entendu cela auparavant, et inclus les choses dans la tête, bien sûr, mais vous avez raison, selon Yahoo, http://developer.yahoo.com/performance/rules.html scripts dans la tête peut ralentir le chargement. J'ai changé ma réponse sur cette base. – Tilendor

@TenJack Pour autant que je sache, le chargement de javascript juste avant l'étiquette permet aux navigateurs de commencer à télécharger des fichiers html, css et images sans attendre tous les fichiers js. Donc mettre vos petits scripts js en ligne ne change rien. De toute façon, ces scripts personnalisés ne sont jamais grands; et s'ils le deviennent, je les déplace dans des fichiers .js séparés. –

Voici une solution si vous voulez vraiment garder le numéro < script> tag minimal dans votre code html et encore pouvoir avoir votre javascript surligné IDE. Il est vraiment utile avec jquery si vous voulez seulement un $ (document) .ready() appel dans votre html ou avec facebook de l'api js appel lorsque le api est chargé, etc ...

layout_helper.rb:

def javascript_jquery_ready(script) 
    content_for(:javascript_jquery_ready) { 
     script .gsub(/(<script>|<\/script>)/, "") 
    } 
    end

application.html.erb:

<script> 
    $(document).ready(function(){ 
     <%= yield(:javascript_jquery_ready) %> 
    }); 
</script>

un fichier de vue:

<% javascript_jquery_ready (capture do %> 
    <script> 
    $('#share_access_link').click(function(){ 
     $('#share_access_form').slideToggle(); 
    }); 
    </script> 
<% end) %>

Cette solution e Je veux que mon code reste organisé et lisible dans mon IDE car je n'ai pas besoin de créer un code partiel pour chaque code js. Même si cela ne change rien pour l'utilisateur final, le résultat html est plus propre.

Source

2011-03-22 20:17:41 plehoux

Y compris javascript en ligne utilisant content_for in rails

Répondre

Questions connexes