Erstens habe ich das Gefühl, dass ich den ganzen Stapel von Beiträgen in dieser Kategorie ungefähr 100 Mal gelesen habe. Während der Titel wie ein Duplikat klingt, meine ich wirklich, dass ich alle Lösungen, die ich gelesen habe, zu den gestellten Fragen bis hin zu der ganzen Verkettungssache mit WP 3.5+ ausprobiert habe.
Mein Skript funktioniert in WP hervorragend, wenn ich auf das eigentliche jquery-Skript und die URL verweise. Ich lese überall, dass dies eine schreckliche Art der Implementierung ist, also habe ich versucht, die integrierten WP-Bibliotheken und den No-Conflict-Wrapper zu verwenden. Ich führe WP 3.6 auf einer lokalen Barebone-InstandWP-Installation mit dem Standarddesign Twentythirteen und keinem anderen Plugin aus.
\\ Works great if I use these in WP 3.6
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
Wie ich bereits sagte, versuche ich, das Richtige zu tun, also habe ich mit einer Reihe von Enqueue- und/oder (De-)Registrierungsoptionen experimentiert. Bisher ist es keinem gelungen:
- Concatenate_scripts = falsch
- jQuery (de)registrieren
- Enqueue (mit den richtigen jQuery-Hooks, wie im Codex referenziert)
Natürlich schreibe ich das $ in jQuery um und so weiter; aber mein Problem scheint bergauf zu sein, wie mir die Firebug-Konsole sagt: Uncaught ReferenceError: jQuery is not defined
So, hier bin ich. Mein Code ist außerhalb von WP gut, aber ich kann ihn anscheinend nicht dazu bringen, ihn für ein Front-End-Plugin in WP mit guten Codierungspraktiken zu verwenden.
\\ Loading the JS library & CSS
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.1/themes/redmond/jquery-ui.min.css" />
\\ Definition of the datepicker rule
<script>
$(".full_date").datepicker({
showOn: 'button',
buttonText: 'Here',
dateFormat: 'DD, dd MM yy',
altFormat: "yy-mm",
altField: ".year-month",
onClose: function (dateText, picker) {
// getDate returns a js Date object
var dateObject = $(this).datepicker("getDate");
console.dir(dateObject);
// Call Date object methods
$("#date input").val(dateObject.getDate());
$("#month input").val(dateObject.getMonth());
$("#day input").val(dateObject.getDay());
$("#year input").val(dateObject.getFullYear());
}
});
</script>
\\ Some HTML
<h1>Date Picker</h1>
<form class="date-picker">
<label>full date</label>
<input type="text" class="full_date" value="" />
<label>year month</label>
<input type="text" class="year-month"/>
</form>
<p id="day">Day of the week: <input name="day" type="text"></input> </p>
<p id="month">Month: <input name="month" type="text"></input></p>
<p id="date">Date: <input name="date" type="text"></input></p>
<p id="year">Year: <input name="year" type="text"></input></p>
Wenn das hilft, habe ich das ganze Ding an jsFiddle
Bitte schön, könnten Sie bei der Syntax helfen, um den Code in WP 3.6+ richtig einzustellen?
Vielen Dank, dass Sie sich die Zeit genommen haben, dies durchzulesen. Greg
AKTUALISIEREN
Hier ist der aktualisierte Code. Ich habe immer noch einen Fehler: “Uncaught ReferenceError: jQuery is not defined”.
<?php
add_action('wp_enqueue_scripts', 'load_my_scripts');
function load_my_scripts(){
wp_enqueue_script('jquery-ui-datepicker', '/wp-includes/js/jquery/ui/jquery.ui.datepicker.min.js', array('jquery'));
wp_register_style('date-picker', plugins_url('includes/jquery-ui-1.10.3.custom.min.css',__FILE__), true);
}
?>
<script type="text/javascript">
(function($) {
$(document).ready(function($){
$("#datepicker").datepicker();
});
});
</script>
<p>Date: <input type="text" id="datepicker" /></p>
Hier könnt ihr es live sehen:
Das vollständige Plugin ist hier
AKTUALISIERUNG 2
Nach einer Weile wurde mir klar, dass mit dem Code nichts falsch war, er musste nur 1 Ebene höher in meinem Plugin-Ordner platziert werden. Ich habe dieses “kugelsichere” Beispiel als Dummy-Plugin erstellt, von dem ich herausgefunden habe, dass die Snippets function & add_action im Stammverzeichnis des eplugin-Ordners sein müssen.
Falls das jemandem hilft, hier ist der Testcode, den ich verwendet habe:
<?php
/*
* Plugin Name: Hello World
*/
add_filter( 'the_content', 'tfr_the_content' );
function thisisonlyatest() {
wp_enqueue_script('jquery-ui-datepicker');
wp_enqueue_style('jquery-ui-datepicker','http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.1/themes/redmond/jquery-ui.min.css' );
}
add_action("wp_enqueue_scripts","thisisonlyatest");
function tfr_the_content( $content ) {
return $content . '<p><input type="text" id="datepicker" value=""/></p>';
}
?>
<script type="text/javascript">
jQuery(document).ready(function() {
jQuery('#datepicker').datepicker({
dateFormat : 'yy-mm-dd'
});
});
</script>
Erstellen Sie einen Ordner in Ihrem Plugin-Ordner. Erstellen Sie dort eine leere PHP-Datei und fügen Sie diesen Code ein. Starten Sie Ihre WordPress-Testinstanz und passen Sie sie von dort aus an Ihre Bedürfnisse an.
Vielen Dank für Ihre Hilfe, ich hoffe, dies wird auch anderen helfen
Greg
Auf welcher Seite fügst du das ein? schreibst du eigentlich
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>in die Seite?– Oh Gott warum
2. August 2013 um 17:38 Uhr
Ja, ich habe die Plugin-Entwicklung von Grund auf als HTML-Seite gestartet. Daher die grundlegende http-Referenz. Aber mir ist klar, dass dies nicht der Weg ist, es einmal IN WordPress zu tun, daher meine offene Frage 🙂
– Greg
2. August 2013 um 21:02 Uhr