1

对不起,如果标题不太清楚,但我认为它是正确的。NEhow,我想做的有点像(在某种程度上)用 JQuery(pref)、PHP 和 CSS 构建一个小部件。

我真正希望发生的是让我网站的“成员”简单地将 2 行代码粘贴到他们的 HTML 中以加载小部件。像这样的东西:

<script type="text/javascript" src="http://www.mydomain.com/script.js"></script>

然后显示像这样的小部件<div id="displaywidget"></div>

好的,那一点很“容易”,还可以。但是如何在 script.js 中包含 JQuery 或“某些东西”来生成小部件

我的意思是“displaywidget” - 小部件 div 的 ID 将是我服务器上的 php 文件的名称,因此基本上 script.js 需要将 displaywidget.php 加载到 div displaywidget 中。

我想我document.getElementById('displaywidget')用来获取 div 但我如何在 div 中“写入/插入/加载”displaywidget.php?

思考我写“纯”java 可以做“我想要的大部分document.getElementById('displaywidget'),但我更愿意“包含”Jquery.js,因为我希望小部件的某些方面使用 JQuery。例如 JQuery UI 日期函数.

对不起,如果我有点漫无边际,但我想一边走一边想。我的“真正”问题是我不太确定“纯”javascript,即让 div 显示/加载 displaywidget.php

请提出建议。(哦,如果我叫错了树,请随时告诉我——很好:))

提前致谢

4

3 回答 3

0

经过多一点“拖网和思考”后,我发现了这段代码:

(function() {
// Localize jQuery variable
var jQuery;
/******** Load jQuery if not present *********/
if (window.jQuery === undefined || window.jQuery.fn.jquery !== '1.4.2') {
var script_tag = document.createElement('script');
script_tag.setAttribute("type","text/javascript");
script_tag.setAttribute("src","http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js");
script_tag.onload = scriptLoadHandler;
script_tag.onreadystatechange = function () { // Same thing but for IE
if (this.readyState == 'complete' || this.readyState == 'loaded') {
scriptLoadHandler();
}
};
// Try to find the head, otherwise default to the documentElement
(document.getElementsByTagName("head")[0] || document.documentElement).appendChild(script_tag);
} else {
// The jQuery version on the window is the one we want to use
jQuery = window.jQuery;
main();
}
/******** Called once jQuery has loaded ******/
function scriptLoadHandler() {
// Restore $ and window.jQuery to their previous values and store the
// new jQuery in our local jQuery variable
jQuery = window.jQuery.noConflict(true);
// Call our main function
main(); 
}
/******** Our main function ********/
function main() { 
jQuery(document).ready(function($) { 
******* Load CSS *******/
var css_link = $("<link>", { 
rel: "stylesheet", 
type: "text/css", 
href: "style.css" 
});
css_link.appendTo('head');          

/******* Load HTML *******/
var jsonp_url = "http://al.smeuh.org/cgi-bin/webwidget_tutorial.py?callback=?";
$.getJSON(jsonp_url, function(data) {
$('#example-widget-container').html("This data comes from another server: " + data.html);
});
});
}
})(); // We call our anonymous function immediately

由 Alex Marandon 编写并在此处找到http://alexmarandon.com/articles/web_widget_jquery/ - 可以满足我的需求,包括/将 JQuery 安装到 .js 文件中

于 2010-11-28T09:48:44.467 回答
0

您可以将 jquery 加载到 script.js 中,只需在 script.js 中的任何 javascript 之后或之前复制并粘贴它。

所以如果 script.js 是:

//start of file
alert('ex');
//end of file

做了:

//start of file
alert('ex')
Copy and pasted Jquery source
//end of file
于 2010-11-28T09:16:46.273 回答
0

我想我使用 document.getElementById('displaywidget') 来获取 div 但我如何在 div 中“写入/插入/加载”displaywidget.php?

您正在寻找 jQuery 内部的 AJAX 行为,它会调用 php 页面,然后将数据推送到 div 中。

你应该在这个过程的早期就加载 jQuery,就在你的 head 元素的前面。加载后,它将被缓存,因此无需担心每个页面上的内容。没有产生真正的开销。

安装 jQuery 后,您可以调用与获取数据和填充元素相关的许多 AJAX 函数之一。除非我去查看他们的文档部分,否则 $.load()、$.ajax() 和其他一些让我无法理解的东西。

您可以在没有 jQuery 的情况下完成所有这些操作,但它的代码更多,并且您必须控制浏览器的差异。

于 2010-11-28T07:58:07.017 回答