Drupal learns to use jquery

Source: Internet
Author: User
Tags drupal

This section learns if you are interacting with jquery in Drupal.

jquery is built-in support in Drupal. exists in the Misc directory of the root directory.

jquery is automatically loaded when the Drupal_add_js method is called.

Embed JS code in the Drupal page

1. Open the PHP filter module. The goal is to embed PHP code in the page.

2. Create a new page.

Note in the following text format, select "PHP Code",

Fill in the Body with the following contents.

<? php    drupal_add_js ('jquery (document). Ready (function () {          jquery ("P"). Hide ();          JQuery ("P"). FadeIn ("slow");      });', ' inline '?>   

Eventually.

Drupal_add_js is a built-in function of Drupal, receiving two parameters

First parameter: Execution of the JS code

The second parameter: inline means to place the JS code in the <script></script> tab of this page, within the

It is important to note that when it is inline, the conflict is avoided. To put the JS code (function ($) {.... Execute the JS code .....}) (JQuery); statement, or use JQuery (), do not use $ ().

Another thing to note is that the JS code has to be escaped with quotes:

<? php    drupal_add_js ('jquery (document). Ready (function () {          jquery ("#one"). Wrap ("<div class=\ ' Error\ ' ></div> ');      ', ' inline '?>   

Introduce JS code files in Drupal

The advantages of using the built-in embedded JS method are more flexible, high execution efficiency, and the disadvantage is that it is inconvenient to debug. Not conducive to the use of production sites. If you accidentally close the PHP filter module, the impact is large.

Method one. Add JS by modifying the theme. info file

1. Create a scripts.js file within your theme folder

2. Edit your theme's info file and add the following line

scripts[] = Scripts.js

3. Clear the cache, or switch to another theme and switch back.

Each page will load this JS file.

Method Two, use JS file for a module

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.