如何在 messager/alert/confirm等消息提示框中获取 / 设置嵌入 html内容中的 input[type=checkbox]等的选中状态?

总结, 有3点:

不能/不要在这些消息框 / 提示框/ 对话框中的回调函数中去写代码: 获取嵌入内容中input.checkbox的选中状态, 因为虽然在这些框存在的时候, 这个

checkbox的 prop('checked') 属性值, 确实是 true, 但是当点击消息框/alert框的 "确定" 按钮后, 这个时候这些选择框已经不存在了! 所以在回调函数中, 再来获取 checkbox的选中状态值, 总是返回的false, 因此你在回调函数中的if判断, 以及设置语句都不会生效! 它们已经消失了. 或者说, 它们存在的空间和回调函数的空间是不同的时空! 是异次空间! 或者说" 在消息框中的内容和在原来的html中的对应内容不是同一个, 是影子, 是copy.
那要怎么去获取真实的消息框/对话框中的 checkbox 选中状态并设置相应的操作呢?

那就是: 在原来的html页面中, 就把判断checkbox 等的/设置语句 script 脚本嵌入进去. 并绑定 checkbox的 click事件. 在这个事件中进行各种设置. 也就是, 趁消息框中的html内容

还没有消失时,在这个时空中去获取固定下来....

<div class="tipbox hidden">

  <p>

  你要在消息框中显示的内容信息等.......

  </p>

  <p><input type="checkbox" class="showOnce" value='0'>不再显示提示框</p>

<!-- 在这里嵌入script语句 , 不要在 回调函数中去写 -->

  <script>

$('input.showOnce').click(function(){

  alert('you click in messager');

  alert('now,prop is: ' + $(this).prop('checked'));

  if($(this).prop('checked')){

    $(this).attr'1');

  }

});

  </script>

</div>

上面的$(this)有点问题, 应该是:

  <script>

$('input.showOnce').click(function(){

  if($(this).prop('checked')){

    // 要注意jquery中的 this, $this的陷阱, 有时候$this并不是想象的对象,所以谨慎的使用$this, 比如下面

    // 的语句用$(this).val(1)就无效!??

     //  $(this).val('1'); 是无效的!

    $('input.showOnce').prop('checked',true);

    $('input.showOnce').val('1');

    // $('input.showOnce').attr('value','1'); 也是可以的

  }

});

  </script>

最后就是要注意 checkbox 的val()和 attr的用法!

如果设置了input[type="checkbox"]的val('值'), 会去改变以有的 attr的值, 即使原来的input的checkbox没有 value属性, 也会自动的 / 显式的添加一个属性value =....

    <div id='test'>

      <input type="checkbox" id="test" >

    </div>

$('input#test').val('a00');

console.log($('div#test').html());      //  <input id="test" value="a00" type="checkbox">

attr()函数也是一样的!

js原生的 confirm 和 $.messager.confrim的区别?

前者不能解释显示消息html字符串中的 html代码, 按原样显示;
后者则可以解释显示消息中的 html代码, 也能执行显示消息中的 script, 这个是非常重要的!

===================================================================================================

js脚本和相关html部分的有效域

在js文件相互嵌入/引用/显示在消息框中时候, js最好和它引用dom的html部分放在一起 (在同一个页面)
不要跨页面去使用js, 就是在一个页面内的js, 去引用/访问另一个页面中的 dom元素, 往往是拿不到的
甚至, 当一端html放在jeasy的messager中时,要执行它里面的dom节点的js动作, 要把js代码嵌入到这段要显示在消息框中的 html内部, 而不要放在其他地方

总之, 就是 js代码最好和它相关引用的html放在一起, (放在/保证在同一个时空中)

js预览本地图像?

就是将 FileReader读取本地图片,返回的 readAsDataUURL 方法图片路径字符串,给预览图像的img 标签的src

firefox官网的一个例子:

function previewFile() {

  var preview = document.querySelector('img');

  var file    = document.querySelector('input[type=file]').files[0];

  var reader  = new FileReader();

// 异步回调中处理

  reader.addEventListener("load", function () {

    preview.src = reader.result;

  }, false); 

// 如果file == true , 读

  if (file) {

    reader.readAsDataURL(file);

  }

}

==================================================================

linux上的十六进制/二进制查看文件? xxd, od, hexdump, hexer, ghex hexyl等

[lee@localhost ~]$ xxd xxd.txt

00000000: 7468 6973 2069 730a 610a 7465 7374 0a0a  this is.a.test..  (默认的用16个字节一行显示, 中间的20 就是空格, 0a就是换行,

00000010: 6120 7370 6163 6520 6c69 6e65 3f0a       a space line?.      所以在16进制下就可以可看到换行/回车不过是一个普通字符而已!)

[lee@localhost ~]$ 

[lee@localhost ~]$ xxd -c 8  -g 1  -s 0 -l 0x08  -u xxd.txt

00000000: 74 68 69 73 20 69 73 0A  this is.

00000008: 61 0A 74 65 73 74 0A 0A  a.test..

-c 每行显示多少个字节

-g 多少个字节1组

-s 从文件的什么位置处开始(注意, 跟-o 选项不一样, -o 是说文件显示在内存的什么位置开始 -off -s是start的意思)

-l length

-u 使用大写的16进制字符表示, 注意这个跟 ascii码的大小写不一样, 后者是有区别的! a: 从 0x61, A: 从0x31 开始. 而16进制的a和A 都是一样的, 都是10

最重要的是: 这里的 linux 中的换行是: 用的 \n, 其16进制是 0xa = (10)十进制的10 就是上面的最后的那个字节, 是不可显示字符,用点号表示

而在win中, 换行是用 CR LF两个字节表示的 CR = enter(0xd =13), LF =换行=(0x0a)

所以在js中要判断换行, 用 a_long_str.split('regExp')中的正则表达式用 : '\r\n|[\n\r]' 前面的 \r\n用来匹配win, 后面的 [\n\r] 用来匹配linux或mac.
因此,你要理解文本文件中的内容实际上是一个长的字符串! 换行只不过也是一个字符! 是一个不可见字符而已. 换行符是长字符串内容中的一个普通地位的字符而已

\r是把光标移动到当前行的行首, 而\n是将光标移动下一行的开头
在vim中也可以显示16进制: 执行命令 :%!xxd (按16进制显示) , 如果按二进制显示 :%!xxd -b 返回文本样式, 用 :%!xxd -r命令

==============

在客户端预览/读取文件内容, 在浏览器的安全机制上是不允许的? 如果确实要这样, 必须有用户进行授权, 当用户点击文件域 input[type=file] 的时候, 就是授权的过程.

为了实现浏览器的兼容, 用html5 提供的 FileReader , 而不用ActiveXObject, 那是ie特有的, 不兼容.

对tp的上传, 有两个容易混淆的名字: 一个是 ->savePath (这个是 upload类的属性), 而 ['savepath'] 则是上传文件的属性!

====

js字符串的正则匹配

默认情况下, 是贪婪匹配, 如果要非贪婪匹配, 就在量词的后面加上?(因为?只能匹配0次或1次,所以是非贪婪匹配)

但是要注意:

js的正则总是从第一个可能的位置开始匹配, 但是如果匹配位置后还有其他文本量需要匹配, 则前面匹配的内容将不得不继续往后匹配...

比如: 'aaab'.match(/a+?/) 将返回一个 'a'

但是 'aaab'.match(/a+?b/) 以为返回的是ab, 但是却返回的是 'aaab' 为什么? 因为 js总是从第一个可能的位置开始匹配, 因此它从第一个a开始匹配, 本来这时候,非贪婪匹配 a+? 就结束了, 但是为了匹配后面的b, 所以就不得不继续匹配, 直到b, 所以返回的结果就是 'aaab'

========================

关于判断js中的"数字字符串", 数字字面的字符串?

js中的函数/方法分为: 全局函数/对象方法; 全局函数就是不是对象的方法属性, 不需要用对象来引用, 比如这里的 Number()等, 当然对象方法就是要由对象来引用的,比如: strObj.substr, 你i不能这样 : substr(str,....)
在jquery中,关于类的增减的方法有三个: addClass, removeClass, 还有一个判断是否有某个类的方法, 就是hasClass : if( $('selector'). hasClass('classnamme'))
有四个函数可以判断包括: Number, isNaN, parseFloat , parseInt

其中 isNaN可以说是等于Number, 因为isNaN就是根据 Number()函数的结果来判断的. 但是 Number并不是直观上的判断, 其他比如 : boolean(false=0, Nuumber(true) =1), null,

[] '', 等都回被Number转换为数字0, 所以isNaN的返回结果都是 false

(为什么不能直接让一个变量跟 NaN做 == !== 的比较? 因为任何变量跟 NaN 做比较, 都是不等的)

而 parseFloat则是解析字符串中的数字

包含的可解析的字符包括4种: +-, 0-9, 小数点, e/E 是科学计数法,表示的是10 的n次方. 注意不是指数函数那个e(exp)
解析时忽略开头和结尾的空格, 如果开头的字符就不能解析的话, 就直接返回NaN

而parseInt则不会解析小数点和e/E, 还要指定解析时字符所表示的基数(即进制) radix[reidiks]

== 所以, 当从文本文件中读取出来的数据, 后, 都成为了 "字符串"类型的, 那么, 如何判断原来的文件中的字段的数据类型呢?

直接判断是没有办法了, 因为从FileReader.result到 str.split() 出来都是字符类型的结果, 所以只有用 "数字字面上的字符串" 来判断它们的原始类型:

为了避免其他类型的干扰, 不要单纯的用 Number/isNaN/parseFloat/parseInt, 而是用 isNaN(parseFloat())来判断, 先用parseFloat来解析, 然后用 isNaN

来判断.