2014-02-05 3 views
0

У меня есть JQuery для выбора файла http://jsfiddle.net/parvathy/e8wr5/Jquery не звонить на кнопку мыши

смотрите пожалуйста скрипку. когда я нажимаю на текстовое поле, этот jquery работает .. но при нажатии на кнопку «Просмотр», которая не работает. Я использую загрузочный ремень css для кнопки и ввода текста, пожалуйста, помогите мне ..

<input type="text" name="fake_section" id="fake_section" class="form-control" style="float:left;">  
<button type="button" id="fake_section" class="btn btn-primary" ">Browse</button> 


$(document).ready(function() { 
$('#fake_section').click(function (e) { 
    e.preventDefault(); 
    $('#file').trigger('click'); 
}); 

$('#file').change(function (e) { 
    var filename = $(this).val(); 
    var ext = filename.split('.').pop().toLowerCase(); 
    if ($.inArray(ext, ['xls', 'xlsx']) == -1) { 
     alert('Only add Excel Files!'); 
    } 
    else { 
     $('input[name="fake_section"]').val(filename); 
    } 
}); 

});

+2

У вас есть повторяющиеся значения атрибута id. Они должны быть уникальными в документе. – Phil

ответ

3

Поскольку у вас есть 2 элемента с идентификатором fake_section, использовать класс вместо этого - при использовании селектора идентификатора он выбирает первый элемент с заданным идентификатором

<input type="text" name="fake_section" class="fake_section form-control" style="float:left;"> 
<button type="button" class="fake_section btn btn-primary" style="margin-left:10px;">Browse-</button> 

затем

$('.fake_section').click(function (e) { 
    e.preventDefault(); 
    $('#file').trigger('click'); 
}); 

Demo: Fiddle

+0

, но я хочу использовать класс ремня безопасности – neel

+0

@Parvathiiiii вы можете иметь несколько классов для элемента –

+1

@Parvathiiiii см. Http://jsfiddle.net/arunpjohny/6fwQp/2/ –

0

Обратите внимание на идентификаторы, ваша ошибка была одинаковой идентификацией в двух элементах управления. Некоторые IDE помогают вам с предупреждением, когда у вас много элементов управления с одинаковыми идентификаторами.

<input type="text" name="fake_section" id="fake_section2" class="form-control" style="float:left;">  
<button type="button" id="fake_section1" class="btn btn-primary" ">Browse</button> 


$(document).ready(function() { 
$('#fake_section1').click(function (e) { 
    e.preventDefault(); 
    $('#file').trigger('click'); 
}); 
Смежные вопросы