行内onclick使用遇坑--------做用域与传入字符串

 问题一：行内onclick触发的函数放在$(funtion(){})内报错，错误代码以下：

1     <input type="button" value="肯定" onclick="say()">
2     <script>
3         $(function(){
4             function say(){
5                 alert(123);
6             }
7         })
8     </script>

运行以后报错：say is not defined

$(function{})的做用相似于window.onload,都是网页加载完成在执行相应的代码。删去$(function(){})以后程序运行正常，看来$(function(){})自己也是一个函数（这么明显以前竟然没注意到），它造成了一个函数做用域，将say()这个函数变成了一个局部变量，$(function(){})外面没法访问。

解决方法：

1.删去$(function(){})，若是将<script>写在最下面，$(function(){})通常能够不用写。

2.若是必学写$(function(){})，将function say(){}改写为window.say = function(){},将say()函数变为全局的。

问题2：行内onclick传入动态字符串，错误代码以下：

1     <script>
2         var str = "asd";
3         $("<input type='button' value='肯定' onclick='say("+str+")'>").appendTo($('body'));
4         function say(str){
5             console.log(str);
6         }
7     </script>

想让点击按钮时，输出的内容随str变化，可是报错asd is not defined

看起来 asd 被当成了变量，因而代码稍做修改：$("<input type='button' value='肯定' onclick='say(\'"+str+"\')'>").appendTo($('body')); 给str加了一个单引号，运行以后又报错：Unexpected token }

查看浏览器控制台发现，这段代码被解析成了这样：<input type="button" value="肯定" onclick="say(" asd')'="">; 询问了大神以后，将str加的单引号改成双引号，程序果真正常运行。通过思考得出结论，在保证js代码单双引号配对的同时，也要保证解析到html中的正确性，即标签中也是区分单双引号的。虽然标签中写成这样<input onclick="say('asd')">(正确写法); 可是被解析到浏览器中查看，都变成了双引号<input onclick="say("asd")">;一度影响了个人判断。。。

解决方法：

1.str外围改成双引号即$("<input type='button' value='肯定' onclick='say(\'"+str+"\')'>").appendTo($('body')); 

2.去掉say()函数的单引号，改成$("<input type='button' value='肯定' onclick=say(\'"+str+"\')>").appendTo($('body')); 这样写浏览器会帮你加一个双引号，并且say()括号中的单双引号被正确解析。