Build a Javascript-based mobile web CMS-add jQuery plug-in, cmsjquery

Build a Javascript-based mobile web CMS-add jQuery plug-in, cmsjquery

When you see the menu of moji CMS, it becomes a toolbar, and it makes sense. So let's continue to see how the CMS sidebar is composed.

RequireJS and jQuery Plug-In Examples

An example of a simple combination is as follows: add the following content in main. js

requirejs.config( {    "shim": {        "jquery-cookie"  : ["jquery"]    }} );

Add

Define (["jquery"], function ($) {// Add function });

In this way, we can add a simple plug-in.

Add jQuery plug-in jQuery Sidr to mojicms

The best jQuery plugin for creating side menus and the easiest way for doing your menu responsive

This is the best and simplest tool to create a responsive sidebar. Therefore, we need to download jQuery. sidr. min. js to the directory, and then modify main. js:

require.config({    baseUrl: 'lib/',    paths: {        'text': 'text',        jquery: 'jquery-2.1.1.min',        async: 'require/async',        json: 'require/json',        mdown: 'require/mdown',        router: '../router',        templates: '../templates',        jquerySidr: 'jquery.sidr.min',        markdownConverter : 'require/Markdown.Converter'    },    shim: {        jquerySidr:["jquery"],        underscore: {            exports: '_'        }    }});require(['../app'], function(App){    App.initialize();});

Add jquery. sidr. min to it.

Collaboration between jQuery Sidr and RequireJS

Reference official sample code

$(document).ready(function() {  $('#simple-menu').sidr();});

We need to add the above initialization code to app. js initialization,

define([    'jquery',    'underscore',    'backbone',    'router',    'jquerySidr'], function($, _, Backbone, Router){    var initialize = function(){        $(document).ready(function() {            $('#menu').sidr();        });        Router.initialize();    };    return {        initialize: initialize    };});

In this way, you can see the final effect by opening modemcms.

Related Resources

QQ group: 344271543

Source code Github: https://github.com/gmszone/moqi.mobi

Jquery javascript restructured dom and added a class to <a/> through addClass, and then operated on this class through other plug-ins.

Based on your description, let's take a look
Step 1.html loading, parse DOM
Step 2. parse the DOM and complete the click events bound to all. popups by the jQuery plug-in.
Step 3: Add. popups to your desired.
......
The problem is that when the plug-in binds the click event, you do not want a to get the. popups, so it will not be bound to the click event.
To solve this problem, step 3 must be executed before step 2.
We recommend the following solutions to solve the problem:
Put the plug-in code after adding the class code as much as possible.

Maybe you still cannot solve your problem, QQ452054962

Example: The Jquery or javascript event triggers the addition of a new html component. How can this problem be solved?

<Td id = 'tdid'> </td> JS: var o = document. createElement ('div ') document. getElementById ('tdid '). appendChild (o) Result: <td id = 'tdid'> <div> </td>