Jquery 点击触发器给出错误“超出最大调用堆栈大小”

我知道我可能会得到很多反对票，但我不在乎，这样的废话让我发疯。这是我得到的：

jq:

function attFile(){
   $("#theFileInput").trigger('click');
};

html:

<a href="#" id="attachfile" onclick="attFile();">
<input type="file" id="theFileInput" style="display:none" />

但这不起作用。我检查了整个 stackoverflow，我使用了实际工作的人的 jsfiddles，但他们在这里失败了。例如：

$('#attachfile').click(functcion () {
$("#theFileInput").trigger('click'); // or triggerHandler or click()
});

or

function attFile(event){
event.preventDefault();
$("#theFileInput").trigger('click');
};

一切都失败了。事件会给我“调用未定义”，而休息给我未捕获的范围错误：超出最大调用堆栈大小如果我打破它alert("jq please");在第一行，根据我使用的代码，一个将永远循环，而其他行将显示警报但不单击该死的文件输入。

Html:

<a href="javascript:void(0);" id="attachfile">Click on me </a>
<input type="file" id="theFileInput" style="display:none" />

JS:

$('#attachfile').click(function () {
$("#theFileInput").trigger('click');
});

Sample http://jsfiddle.net/eR64x/