JavaScript:文件输入onclick防止更改,如果用户取消确认()

时间:2012-04-03 18:56:28

标签: javascript confirm dom-events

使用confirm()方法时,如何防止表单文件输入元素通过onclick DOM事件进行更改?

在示例中,我希望通过询问用户是否希望Ok | cancel,让用户有机会不丢失文件输入元素的值,如果他们单击取消则不应显示文件对话框窗口。

XHTML

<input name="post_file" onclick="images_change();" type="file" value="" />

的JavaScript

function images_change()
{
 var answer = confirm('Okay or cancel, if you cancel no dialog window will be displayed.');

 if (answer)
 {
  answer = true;
  //previous item previews deleted here in a while loop.
 }
 else {answer = false;}

 return answer;
}

3 个答案:

答案 0 :(得分:3)

如果您输入一个文件,为什么不直接内联?

HTML:

<input name="post_file" onclick="return check()" type="file" value="" />​

JavaScript的:

function check() {
    return confirm('Okay or cancel, if you cancel no dialog window will be displayed.');
}​

<强> jsFiddle example

答案 1 :(得分:2)

document.getElementById('post_file').addEventListener('click',function(e) {images_click(e);},false);

function images_click(e)
{
  var answer = confirm('Ok or cancel?');

  if (answer)
  {
   //shows file selection dialog window.
  }
  else {e.preventDefault();}
 }
}

答案 2 :(得分:0)

您需要返回confirm结果,并返回函数结果:

<input name="post_file" onclick=" return images_change();" type="file" value="" />​

function images_change() {
    return confirm('Okay or cancel, if you cancel no dialog window will be displayed.');
}

<强> LIVE DEMO