2011-08-09 126 views
3

裏面我有一個jQuery UI的對話框中,該包含<form>含有<input type=file>文件對話框不會出現一個jQuery-UI-對話框

對於我的一些用戶,當他們點擊按鈕打開文件對話框:它沒有出現。

,因爲有這個問題將能夠使用他們所有已安裝的瀏覽器來重現電腦問題的基礎不是瀏覽器:

  • 火狐
  • 的Internet Explorer

的問題不是基於操作系統,因爲我已經看到問題的發生:

  • 視窗XP
  • Windows 7的
  • 的Kubuntu 11.04

我已經與操作系統安裝虛擬機和文件對話框將可以正常使用。

所以我的問題是:任何人有任何想法是怎麼回事?

這裏的 「代碼」:

<meta charset="utf-8"> 

    <link rel="stylesheet" href="http://matchfwd-statics.s3-website-us-east-1.amazonaws.com/asset_cache/css/e1b34bd841d9.css" type="text/css" media="all"> 
    <script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js'> 

<script> 

     $(function() { 
     $("#dialog-form").dialog({ 
      autoOpen: false, 
      height: 500, 
      width: 550, 
      modal: true, 
      buttons: { 
      "Send": function() { 
       $(this).dialog("close"); 
      }, 
      Cancel: function() { 
      $(this).dialog("close"); 
      } 
      }, 
      close: function() { 
      allFields.val("").removeClass("ui-state-error"); 
      } }); 

     $("#create-user") .button() .click(function() { $("#dialog-form").dialog("open"); }); 
     }); 
</script> 
<div class="demo"> 

    <div id="dialog-form" title="Create new user"> 
    <p class="validateTips">All form fields are required.</p> 
    <form class="main-form" method="post" action="" enctype="multipart/form-data"> 
     <h3>Fill in some details</h3> 
     <span class="title">Your profile will be submitted with your application:</span><br/> 
     <div class="holder" style="position:relative;top:12px"><a style="color:#24c2c9;" href="></a></div> 
     <br> 
     <span class="title">Why would you be the right candidate?</span><br/> 
     <div class="holder"><textarea class="" name="description" cols="58" rows="10"> </textarea></div> 
     <span class="note"></span> 
     <span class="title">Attachments&nbsp;<a href="#" id="add_attachment" class="plus">&nbsp;</a></span> 
     <div id="attachments" class="holder"></div> 
    </form> 
</div> 

<button id="create-user">Create new user</button> 

<script type="text/javascript"> 
(function() { 
    var counter=1; 
    $("#add_attachment").click(function(e){ 
    e.preventDefault(); 
    var attachmentString = 'attachment-'+counter 
    var inputString = '<input type="file" name="'+attachmentString+'" id="id_'+attachmentString+'" />' 
    $(inputString).appendTo("#attachments") 
    counter = counter+1 
    })})(); 
</script> 
+0

如果您可以在受影響的區域以及腳本中顯示代碼,也許我們可以瞭解正在發生的事情。 – ace

+0

感謝您的鏈接,試圖打破一些與重度用戶互動的js,但似乎並沒有發生。如果這種情況發生在具有所有3個瀏覽器的單臺計算機上,我們可能需要檢查ajax請求會發生什麼情況以打開對話框。此外,這隻會發生在'apply'按鈕上,或者也發生在'share'按鈕上。 – ace

+0

沒有它發生在多臺電腦上。一臺配XP的舊P4,一臺配Windows 7的新筆記本和一臺配Kubuntu的上網本。但Ubuntu的情況很奇怪,因爲傢伙重新啓動(爲了一些不公開的原因),然後它正在工作....唯一的問題是,當點擊應用彈出窗口中的附件時,你會得到一個文件對話框。在某些計算機上,文件對話框不會出現。 –

回答

3

我剛剛經歷了這個(OSX,鉻),並發現你的問題。因爲你沒有找到答案,我決定做一些瘋狂的事情。 (「input.file」)。live('click',function(element){element.click()});

...這實際上解決了這個問題。請注意,如果你把一個;在click()之後,它會給出一個錯誤,指出該元素沒有click方法。

我不知道這是爲什麼起作用。這是我實施過的第二次最糟糕的黑客攻擊,我對此感到羞恥。有人,請弄清楚這一點,所以我不必在代碼中留下這個醜陋,醜陋的黑客。

另請注意,我的輸入有'文件'類,因此您可能需要更改選擇器以符合您的需求。

1

這沒有任何意義,謝謝威廉閣下的解決方案。出於某種原因,我無法評論你的答案。

但是即使沒有「;」,我依然會得到沒有點擊的方法。

後來編輯 沒關係,這是一個事件泡沫,一切都爲我搞砸了。