Файловый диалог не появляется внутри jquery-ui-dialog

Question

У меня есть jquery-ui-диалог, который содержит <form>, который содержит <input type=file>

Для некоторых из моих пользователей, когда они нажимают на кнопку, чтобы открыть диалоговое окно файла: он не 't.

Проблема не связана с браузером, поскольку компьютер, на котором возникла эта проблема, может воспроизвести ее со всеми установленными браузерами:

• chrome
• firefox
• Internet Explorer

Проблема не связана с ОС, поскольку я видел возникновение проблемы с:

• windows XP
• windows7
• 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>

Answer 1

Я только что испытал это (OSX, Chrome) и нашел ваш вопрос. Поскольку вы не нашли ответа, я решил сделать что-то сумасшедшее.

$ ("input.file"). Live ('click', function (element) {element.click ()});

... Это на самом деле решает проблему. Обратите внимание, что если вы положили; после click () будет выдано сообщение о том, что у элемента нет метода click.

Я не знаю, почему это работает. Это второй худший взлом, который я когда-либо реализовывал, и мне стыдно за это. Кто-то, пожалуйста, поймите это, чтобы мне не пришлось оставлять этот уродливый, уродливый хак в моем коде.

Также обратите внимание, что у моего ввода был класс 'file', поэтому вам может потребоваться изменить селектор в соответствии с вашими потребностями.

Answer 2

Это не имеет смысла, спасибо, Уильям, за ваше решение.Я не могу комментировать ваш ответ по какой-то причине.

Но я все еще получаю метод без щелчка, даже без ";".

Позже РЕДАКТИРОВАТЬ Не берите в голову,это был пузырь событий, который все испортил для меня.