आदेश पृष्ठ ताज़ा करने पर या जब सामग्री एक और करने के लिए एक पेज से लोड कर रहा है, मैं इस समाधान @Buzinas द्वारा किए गए लागू करने के लिए कोशिश कर रहा हूँ कतरन बिना logotext <div class="small-7 medium-4 columns logo"> और मेनू <nav class="pagedMenu" role="navigation">, रखने के लिए (विशेष धन्यवाद)। कुछ और शब्दों में:कैसे ठीक से एक कस्टम ajax लागू करने के लिए
header.php में हम इस स्क्रिप्ट है:
<head>
...
<script>
function ajax(url, callback, method, params) {
if (!method) method = 'GET';
var xhr = new XMLHttpRequest();
xhr.open(method, url);
if (callback) xhr.addEventListener('load', function() {
callback.call(this, xhr);
});
if (params) {
params = Object.keys(params).map(function(key) {
return encodeURIComponent(key) + '=' + encodeURIComponent(params[key]);
}).join('&');
xhr.send(params);
} else {
xhr.send();
}
}
// CUSTOM AJAX CONTENT LOADING FUNCTION
function ajaxRevslider(obj) {
// obj.type : Post Type
// obj.id : ID of Content to Load
// obj.aspectratio : The Aspect Ratio of the Container/Media
// obj.selector : The Container Selector where the Content of Ajax will be injected. It is done via the Essential Grid on Return of Content
var content = "";
data = {};
data.action = 'revslider_ajax_call_front';
data.client_action = 'get_slider_html';
data.token = '<?php echo wp_create_nonce("RevSlider_Front"); ?>';
data.type = obj.type;
data.id = obj.id;
data.aspectratio = obj.aspectratio;
// SYNC AJAX REQUEST
jQuery.ajax({
type:"post",
url:"<?php echo admin_url('admin-ajax.php'); ?>",
dataType: 'json',
data:data,
async:false,
success: function(ret, textStatus, XMLHttpRequest) {
if(ret.success == true)
content = ret.data;
},
error: function(e) {
console.log(e);
}
});
// FIRST RETURN THE CONTENT WHEN IT IS LOADED !!
return content;
};
// CUSTOM AJAX FUNCTION TO REMOVE THE SLIDER
function ajaxRemoveRevslider(obj) {
return jQuery(obj.selector+" .rev_slider").revkill();
}
document.addEventListener('DOMContentLoaded', function() {
var main = document.querySelector('div[role=main]'),
spinner = document.querySelector('div.sk-spinner'),
pages = {};
window.addEventListener('load', function() {
toggleSpinner(false);
});
function toggleSpinner(b) {
spinner.classList[b ? 'remove' : 'add']('hidden');
document.getElementById('wrapper').style.opacity = b ? 0 : 1;
}
function changePage(url, title) {
setTimeout(function() {
window.SITE.init();
window.vc_js();
}, 0);
history.pushState({
html: main.innerHTML,
title: title
}, '', url);
toggleSpinner(false);
}
document.getElementById('menu-menu-2').addEventListener('click', function(e) {
var el = e.target;
if (el.tagName === 'A') {
e.preventDefault();
toggleSpinner(true);
if (pages[el.href]) {
main.innerHTML = '';
main.appendChild(pages[el.href]);
changePage(el.href);
}
else {
ajax(el.href, function(xhr) {
var frag = document.createRange().createContextualFragment(xhr.responseText);
main.innerHTML = '<div>' + frag.querySelector('div[role=main]').innerHTML + '</div>';
//pages[el.href] = main.firstElementChild;
var _currentScripts = [].slice.call(document.querySelectorAll('script'));
[].forEach.call(frag.querySelectorAll('script'), function(el, i) {
if ((el.src === '' && el.parentNode)
|| el.src.indexOf('slider') >= 0
|| el.src.indexOf('Scroll') >= 0
|| el.src.indexOf('vendor') >= 0
|| el.src.indexOf('composer') >= 0
) {
var s = _currentScripts.filter(function(x) {
return x.src === el.src;
});
while (s.length) {
if (s[0].parentNode)
s[0].parentNode.removeChild(s[0]);
s.shift();
}
document.body.appendChild(el);
}
});
[].forEach.call(frag.querySelectorAll('style'), function(el, i) {
document.querySelector('head').appendChild(el);
});
changePage(el.href, frag.querySelector('title').textContent);
});
}
}
});
window.addEventListener('popstate', function(e) {
if (e.state) {
main.innerHTML = e.state.html;
document.title = e.state.title;
}
});
});
</script>
...
</head>
निम्नलिखित jquery-ready.js पंजीकृत/script-calls.php में कतारबद्ध है:
(function($){
var readyList = [];
// Store a reference to the original ready method.
var originalReadyMethod = jQuery.fn.ready;
// Override jQuery.fn.ready
jQuery.fn.ready = function(){
var args = [].slice.call(arguments);
if(args.length && args.length > 0 && typeof args[0] === 'function') {
readyList.push(args[0]);
}
// Execute the original method.
originalReadyMethod.apply(this, args);
};
// Used to trigger all ready events
$.triggerReady = function() {
$(readyList).each(function(i, el) {
try {
el.apply(el);
} catch(e) {
console.log(e);
}
});
};
})(jQuery);
इसके अलावा, page.php में मैं प्रतिस्थापित get_header() और get_footer() निम्नानुसार कार्य:
<?php
if(!isset($_REQUEST['ajax'])){
get_header();
}
?>
<?php
if (is_page()) {
$id = $wp_query->get_queried_object_id();
$sidebar = get_post_meta($id, 'sidebar_set', true);
$sidebar_pos = get_post_meta($id, 'sidebar_position', true);
}
?>
...
<?php
if(!isset($_REQUEST['ajax'])){
get_footer();
}
?>
अभी भी कुछ क्रांति स्लाइडर या दृश्य संगीतकार लंबन सामग्री के साथ एक पृष्ठ लोड करने के लिए, जैसे हम लंबन या पर उदाहरण के लिए पृष्ठों है हमारे बारे में की कोशिश कर रहा मुद्दे हैं।
आप use this link कर सकते हैं और उपरोक्त पृष्ठों पर नेविगेट कर सकते हैं; टेस्ट केवल क्रोम 45.0.2454.101 मीटर 64-बिट/विन 7 में किए गए हैं, अभी तक आईई, फ़ायरफ़ॉक्स, मोबाइल आदि के लिए तैयार नहीं हैं।
व्यवहार के बारे में: रेव स्लाइडर लंबन सामग्री, दूसरी कड़ी यात्रा (होम या लंबन पृष्ठों) से तले हो जाएगा; विजुअल कंपोज़र लंबन सामग्री (डेस्क चित्र पर लड़का, हमारे बारे में उदाहरण के लिए पृष्ठ) पहली लिंक विज़िट पर तय किया गया है - F5 ठीक होने के बाद;
मेनू mynewmenu.js सत्र पर राज्य याद होगा, तो u'll ओडर में ब्राउज़र बंद करने के लिए कई सीधे संपर्क ठीक से यात्रा करने के लिए की है।
मैं मुझे बता रेव स्लाइडर समर्थन दल से उत्तर प्राप्त किया है:
अजाक्स लिए सबसे अच्छा विकल्प सिर्फ एक नियमित रूप से पेज/पोस्ट करने के लिए स्लाइडर का शोर्ट जोड़ने के लिए, और फिर स्लाइडर के "init" स्क्रिप्ट है स्लाइडर के एचटीएमएल के साथ स्वचालित रूप से शामिल किया जाएगा। फिर जब स्लाइडर का HTML DOM से हटा दिया जाता है, तो सभी jQuery ईवेंट भी हटा दिए जाते हैं। इसलिए आपको केवल पृष्ठ/पोस्ट सामग्री के रूप में स्लाइडर में खींचने की ज़रूरत है, और फिर आपको स्लाइडर के लिए विशेष रूप से किसी भी कस्टम स्क्रिप्ट की आवश्यकता नहीं होगी।
दुर्भाग्यवश मुझे पता नहीं है कि मैं अपने पहले से प्राप्त समाधान में उपर्युक्त उत्तेजना को लागू करने के तरीके से कैसे संपर्क कर सकता हूं।
एपीआई (?) से संबंधित कुछ हो सकता है मुझे इन इंफोस को Revolution slider/Visual Composer पृष्ठों पर मिला है। कोई विचार?
@Patel हे वहाँ, के लिए खेद देर से जवाब; असल में, सवाल मुझे लगता है कि यह स्पष्ट है, शायद, इस विषय को ध्यान में रखते हुए अस्पष्ट है :) कोई अपराध नहीं। क्या आप एक वर्डप्रेस उपयोगकर्ता/डेवलपर हैं? मैं जो हासिल करने की कोशिश कर रहा हूं वह इस बात में क्रांति स्लाइडर और विजुअल कंपोज़र प्लगइन्स को एकीकृत करने वाला एक पूर्ण कार्यात्मक AJAX है; वैसे भी, मैं कुछ लोगों में [इसे लागू करने की कोशिश करूंगा) (http://stackoverflow.com/a/32928023/4642215), पर्याप्त समय होने की उम्मीद है; सही जवाब हो सकता है। आपकी रूचि के लिए धन्यवाद। –
यदि आप अपनी चिंताओं को अलग करते हैं तो डीबग करना आसान होगा। जावास्क्रिप्ट एक PHP फ़ाइल में नहीं होना चाहिए। गतिशील HTML प्रस्तुत करने के लिए PHP फ़ाइल का उपयोग करें और फिर उसमें हेरफेर करने के लिए एक जावास्क्रिप्ट फ़ाइल का उपयोग करें। – freak3dot
@ freak3dot हैलो, मैं यह कर सकता हूं, यह कोई समस्या नहीं है। मैंने js अनुक्रम को _wp-content/themes/notio-wp/assets/js/buzinas.js_ फ़ाइल में स्थानांतरित कर दिया है और इस पल में, फ़ाइल _script-call.php_ में पंजीकृत/संलग्न है। –