博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
sencha touch 学习笔记- ajax、jsonp、dom查找、组件查找、添加css
阅读量:5876 次
发布时间:2019-06-19

本文共 1717 字,大约阅读时间需要 5 分钟。

除了在store中通过代理获取数据外,还可以通过ajax或jsonp方式获取数据,开始学touch时找了半天也没找见ajax的方式。。

这是 使用aiax api 的地址

ajajx

例如最简单的 发起一个请求

Ext.Ajax.request({
url: '',
callback: function(options, success, response) {
console.log(response.responseText);
}
});

其他的ajax相关的可以看官方api的相关实例

jsonp

但是在phonegap中必须使用jsop的方式

这是jsonp的api

这是我在博客详情页面获取博客内容的jsonp 的代码

jsonp 其他的设置方式与发起ajax请求的方式相同

具体可以参考

Ext.data.JsonP.request({                    //we give it the url to the free worldweatheronline.com api                    url:'http://qqloving.com/Account/getblogsinfo/3099099/'',                    callbackKey: 'callback',                    success: function(result) {                        aRecord.data.text=result.text;                        myblog.setData(aRecord.data);                        }                });

 

 

添加自己的css

由于博客园的博客文章和新闻文章中都有比较大的图片,直接在手机上浏览很不方便因此需要定义样式,缩小图片在页面上的尺寸,

添加自己的样式到sencha touch

将自己廷加的css写在这里在打包的时候才能打包上,写在其他地方打包时候可能就打包不上了

dom查找和组建查找

现在在手机页面上显示的是小图,我要实现点击图片查看大图的功能,因此需要在博客内容被添加到页面上查找图片

在sencha touch 中查找分两种

第一种查找:是sencha touch 中的组件 例如Panel组件

                  这样查找出来的对象会有sencha touch 很多属性方法事件、例如触摸、拖拽等

第二种查找:是查找页面上的dom ,例如我要查找的的图片

                 这样查找出来的对象只有dom原生的一些点击等事件和方法

                 这个时候可以用 Ext.get(***) 方法将结果转化为 sencha touch 对象,就可以有很多方法和事件可以用了

 

(PS:官方的文档在这里似乎不太准确,当然也可能是我理解有误,欢迎专家告诉我正确答案)

这是官方和查找相关的api(我对这几个类理解也是模模糊糊的。。。。。。)

  •              这个里面的方法给我的感觉是侧重修改dom本身的一些东西,例如修改css、修改属性等,个人感觉是修改组建 的
  •      这个我感觉和上面的差不多,是上面的简化版的样子
  •                         dom相关的,方法和上面一样多
  •                          这个侧重于增删改 ,里面的方法比上面几个少多了
  •                   这个看官方文档主要用于查询也就是里面的select方法
  •                      发起ajajx请求

 

我平时比较喜欢用这几个方法

1: Ext.dom.Element.select("#imgvewtag")  如果不确定要用找到的结果中一个还是多个,就用这个

     通常这个方法配合一个遍历方法 Ext.Array.each   用来遍历 结果集中的elements

   例如:

Ext.Array.each(Ext.dom.Element.select("#imgvewtag").elements, function(name, index, countriesItSelf) {});

 

2: Ext.dom.Element.down("#imgvewtag")  确定了,只用找个结果中的第一个

转载地址:http://wdzix.baihongyu.com/

你可能感兴趣的文章
知行合一
查看>>
jmeter插件之jsonpath提取响应结果和做断言
查看>>
发布支持多线程的PowerShell模块 —— MultiThreadTaskRunner
查看>>
Ubuntu ctrl+alt会导致窗口还原的问题
查看>>
第四十期百度技术沙龙笔记整理
查看>>
推荐系统那点事 —— 基于Spark MLlib的特征选择
查看>>
linux 下RTL8723/RTL8188调试记录(命令行)【转】
查看>>
開始新的征程
查看>>
SpringMVC案例1——对User表进行CRUD操作
查看>>
看雪CTF第十四题
查看>>
模拟生命_吸烟致癌?
查看>>
[Contiki系列论文之1]Contiki——为微传感器网络而生的轻量级的、灵活的操作系统...
查看>>
Android 网络编程 记录
查看>>
微软同步发行Windows 10和Windows 10 Mobile系统更新
查看>>
Maven 传递依赖冲突解决(了解)
查看>>
Zeppelin的入门使用系列之使用Zeppelin运行shell命令(二)
查看>>
安装kali linux 2017.1 【二、安装VMware-tools 以及相关问题处理】
查看>>
[Spark][Python]Spark Join 小例子
查看>>
form表单下的button按钮会自动提交表单的问题
查看>>
大战设计模式【11】—— 模板方法模式
查看>>