UITableViewController与UIViewControlle...-jQuery ajax —— Baidu ajax-一个级联菜单demo

当前位置: 编程技术>WEB前端

本页文章导读:

▪UITableViewController与UIViewController中使用UITableView 之前使用TableView的时候都是继承UIViewController，然后继承两个delegate，如下面的代码。 @interface SomeViewController : UIViewController <UITableViewDelegate, UITableViewDataSource>.csharpcode, .csharpcode pre{font-siz.........

▪jQuery ajax —— Baidu ajax 你没有看错标题，本文的确是在讲Baidu ajax，不过是很久很久以前的版本了。由于jQuery ajax模块有800+行，而核心函数jQuery.ajax就有380+行，直接分析这段代码很容易被代码逻辑弄晕。所以我们先.........

▪一个级联菜单demo 最近在学些web前段的知识，看见博客园首页左侧的一个级联菜单，就想写一个demo.呵呵<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xml.........

[1]UITableViewController与UIViewController中使用UITableView

来源: 发布时间: 2013-11-06

之前使用TableView的时候都是继承UIViewController，然后继承两个delegate，如下面的代码。

@interface SomeViewController : UIViewController <UITableViewDelegate, UITableViewDataSource>.csharpcode, .csharpcode pre{font-size: small;color: black;font-family: consolas, "Courier New", courier, monospace;background-color: #ffffff;/*white-space: pre;*/}.csharpcode pre { margin: 0em; }.csharpcode .rem { color: #008000; }.csharpcode .kwrd { color: #0000ff; }.csharpcode .str { color: #006080; }.csharpcode .op { color: #0000c0; }.csharpcode .preproc { color: #cc6633; }.csharpcode .asp { background-color: #ffff00; }.csharpcode .html { color: #800000; }.csharpcode .attr { color: #ff0000; }.csharpcode .alt {background-color: #f4f4f4;width: 100%;margin: 0em;}.csharpcode .lnum { color: #606060; }

这篇文章《如何使用UITableView》讲述了我怎样使用TableView。最近想使用iOS6的 UIRefreshControl，不幸的是这个UIRefreshControl 只能使用在UITableViewController里面，不能支持UIViewController。Thanks Apple, make things more difficult. 因此我不对不把UIViewController改成UITableViewController。

这篇文章讲述了两者的区别。

http://www.iosdevnotes.com/tag/uitableviewcontroller/

UIViewController vs UITableViewController

The class that implements the delegate methods is almost always the view controller that owns the table view. What should that class be? Most view controllers are usually subclasses of UIViewController, but iOS also provides a UITableViewController.

UITableViewController only provides a few features on top of UIViewController:

UITableViewController has a tableView property built-in that points to its table view.
UITableViewController will automatically make itself the data source and delegate, unless you specifically change it.
The UITableViewController will reload the table view’s data the first time it’s loaded. It will also clear any selected rows whenever the table view is displayed.
After the table view appears, it will flash the table view’s scroll indicators. This is a hint to the user that there’s more data than they currently see on the screen.
If there’s a navigation bar with an Edit/Done button, the UITableViewController will hook it up to toggle the edit mode of the table view.

Basically, it saves a little bit of time by automatically implementing some common and expected code. If you don’t want any of this behavior, you can always do it yourself within a UIViewController. Just remember to manually implement the steps listed above yourself, if you still want them. You might have seen apps where you select a row from a table, go to a new screen, and when you come back the row is still highlighted. This is usually a sign that someone used a UIViewController with their table view and forgot to clear the selection .

The most common times when I don’t use a UITableViewController in my apps is usually when the view controller needs extra functionality beyond just a table view. Perhaps I want the table view nested inside another view, for example. Usually though, you can use a UITableViewController, as we do in the example below.

A helpful hint: if you’re creating a new view controller though Xcode (like under File -> New -> New File…), you can select “UIViewController subclass”, and then on the next screen, choose “UITableViewController” from the “Subclass of” drop down.

看起来UITableViewController更加方便，但是我喜欢UIViewController 的灵活性。对于使用UIRefreshControl的需求，我也别无选择，不得不改成UITableViewController。把Storyboard了页面重新做一遍，重新写ViewController类。

本文链接

[2]jQuery ajax —— Baidu ajax

来源: 发布时间: 2013-11-06

你没有看错标题，本文的确是在讲Baidu ajax，不过是很久很久以前的版本了。

由于jQuery ajax模块有800+行，而核心函数jQuery.ajax就有380+行，直接分析这段代码很容易被代码逻辑弄晕。

所以我们先分析一段简单的ajax代码，来自早期的百度七巧板项目。

通过这个来先复习一遍ajax的知识。

baidu.ajax.request分离版

/**
* 发送一个ajax请求
* @author: allstar, erik, berg
* @name ajax.request
* @function
* @grammar ajax.request(url[, options])
* @param {string} url 发送请求的url
* @param {Object} options 发送请求的选项参数
* @config {String} [method] 请求发送的类型。默认为GET
* @config {Boolean} [async] 是否异步请求。默认为true（异步）
* @config {String} [data] 需要发送的数据。如果是GET请求的话，不需要这个属性
* @config {Object} [headers] 要设置的http request header
* @config {number} [timeout] 超时时间，单位ms
* @config {String} [username] 用户名
* @config {String} [password] 密码
* @config {Function} [onsuccess] 请求成功时触发，function(XMLHttpRequest xhr, string responseText)。
* @config {Function} [onfailure] 请求失败时触发，function(XMLHttpRequest xhr)。
* @config {Function} [onbeforerequest] 发送请求之前触发，function(XMLHttpRequest xhr)。
*
* @meta standard
* @see ajax.get,ajax.post
*
* @returns {XMLHttpRequest} 发送请求的XMLHttpRequest对象
*/
var ajax = {};
ajax.request = function(url,options,type){
// 是否需要异步
var async = options.async||true,
// 用户名、密码
username = options.username||"",
password = options.password||"",
// 需要传输的数据
data = options.data||"",
// GET还是POST
method = (options.method||"GET").toUpperCase(),
// 请求头
headers = options.headers||{},
// 事件处理函数表
eventHandler = {},
// 请求数据类型
dataType = type||"string";//xml||string

function stateChangeHandler(){
// 看看是否已经准备好了
if(xhr.readyState == 4){
// 得到xhr当前状态
var sta = xhr.status;
// 判断是否成功
if(sta == 200||sta == 304){
// 成功则触发成功
fire("success");
}else{
// 失败则触发失败
fire("failure");
}

// 清除绑定
window.setTimeout(function(){
xhr.onreadystatechange= new Function();
if (async){
xhr = null;
}
},0);
}
}

function fire(type){
// 把type变成ontype
type = "on"+type;
// 在事件处理器表中找到对应事件的处理函数
var handler = eventHandler[type];
// 如果函数存在，则
if(handler){
// 不成功的话
if(type != "onsuccess"){
handler(xhr);
// 成功了
}else{
// 则根据dataType返回不同的数据
handler(xhr,dataType!="xml"?xhr.responseText:xhr.responseXML);
}
}
}

// 组装eventHandler
for(var key in options){
eventHandler[key] = options[key];
}

// 新建一个XMLHttpRequest对象
var xhr = new XMLHttpRequest();
// 如果方法是GET，则把数据组装到url中
if(method == "GET"){
url += (url.indexOf("?")>=0)?"&":"?";
url += data;
// 清空data
data = null;
}
// 如果是异步
if (async){
// 绑定readystatechange的处理器
xhr.onreadystatechange = stateChangeHandler;
}
// 看看是否需要输入密码
if(username){
xhr.open(method,url,async,username,passowrd);
}else{
xhr.open(method,url,async);
}
// 如果是POST
if(method == "POST"){
// 设置一下请求头
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
}
// 把options中的请求头信息全部设置进去

[3]一个级联菜单demo

来源: 发布时间: 2013-11-06

最近在学些web前段的知识，看见博客园首页左侧的一个级联菜单，就想写一个demo.呵呵

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <style type="text/css">
        *
        {
            padding: 0px;
            margin: 0px;
        }
        .dis_none
        {
            display: none;
        }
        .dis_block
        {
            display: block;
        }
        .subSheet
        {
            position: absolute;
            left: 100px;
            z-index: 10;
            width: 100px;
        }
        ul
        {
            list-style: none;
        }
        li
        {
            border: 1px solid blue;
            width: 100px;
            background-color: Gray;
        }
        li a
        {
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <ul>
            <li onmousemove="mouse_over(1010)" onmouseout="mouse_out(1010)"><a href="">.NET精华区</a>
                <div id="1010">
                    <ul>
                        <li><a href="">新手入门</a></li>
                        <li><a href="">托管代码</a></li>
                        <li><a href="">非托管代码</a></li>
                    </ul>
                </div>
            </li>
            <li onmousemove="mouse_over(1011)" onmouseout="mouse_out(1011)"><a href="">嵌入式</a>
                <div id="1011">
                    <ul>
                        <li><a href="">新手入门</a></li>
                        <li><a href="">嵌入式入门</a></li>
                        <li><a href="">嵌入式进阶</a></li>
                    </ul>
                </div>
            </li>
            <li onmousemove="mouse_over(1012)" onmouseout="mouse_out(1012)"><a href="">单片机</a>
                <div id="1012">
                    <ul>
                        <li><a href="">新手入门</a></li>
                        <li><a href="">单片机入门</a></li>
                        <li><a href="">单片机进阶</a></li>
                    </ul>
                </div>
            </li>
            <li><a href="">软件测试</a></li>
        </ul>
    </div>
    </form>
</body>
</html>
<script src="/blog_article/Scripts/jquery-1.6.3.js" type="text/javascript"></script>
<script type="text/javascript">
    function mouse_over(i) {
        $("#" + i).removeClass("dis_none");
    }
    function mouse_out(i) {
        $("#" + i).addClass("dis_none");
    }
</script>

本文链接