Как сделать выборку
Здравствуйте. Помогите пожалуйста сделать выборку элемента, используя $(this). Вот код HTML:
<form id='f1'> <textarea name='name1-1' id='id1-1' class='class1'></textarea> <textarea name='name1-2' id='id1-2' class='class1'></textarea> <p><input type='reset' value='Очистить' class='inputBT'><input type='submit' value='Сохранить' name='name1' id='BT1' class='inputBT JTInput'></p> </form> <form id='f2'> <textarea name='name2-1' id='id2-1' class='class1'></textarea> <textarea name='name2-2' id='id2-2' class='class1'></textarea> <p><input type='reset' value='Очистить' class='inputBT'><input type='submit' value='Сохранить' name='name2' id='BT2' class='inputBT JTInput'></p> </form> Нужно выбрать текстовые поля относительно нажатой кнопки (.JTInput). Пробовал и prev, prevAll, parent и другие ($(this).prevAll(".class1")) - не могу выбрать. Эти формы я отправляю с помощью Аякс, и таких форм у меня почти десять. Не хочу для каждого отдельную функцию делать (точнее уже сделал - но код получился очень не красивый и громоздкий). Хочу одну универсалую функцию сделать, чтобы при нажатии на кнопку автоматом выбирались нужные объекты. Помогите пожалуйста, кто знает. |
Булат Азат улы,
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
$(function() {
$(".JTInput").on("click", function(event) {
event.preventDefault();
var data = $(this.form).serialize();
alert(data);
})
});
</script>
</head>
<body>
<form id='f1'>
<textarea name='name1-1' id='id1-1' class='class1'></textarea>
<textarea name='name1-2' id='id1-2' class='class1'></textarea>
<p><input type='reset' value='Очистить' class='inputBT'><input type='submit' value='Сохранить' name='name1' id='BT1' class='inputBT JTInput'></p>
</form>
<form id='f2'>
<textarea name='name2-1' id='id2-1' class='class1'></textarea>
<textarea name='name2-2' id='id2-2' class='class1'></textarea>
<p><input type='reset' value='Очистить' class='inputBT'><input type='submit' value='Сохранить' name='name2' id='BT2' class='inputBT JTInput'></p>
</form>
</body>
</html>
|
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Пример</title>
</head>
<body>
<form id='f1'>
<textarea name='name1-1' id='id1-1' class='class1'></textarea>
<textarea name='name1-2' id='id1-2' class='class1'></textarea>
<p><input type='reset' value='Очистить' class='inputBT'>
<input type='submit' value='Сохранить' name='name1' id='BT1' class='inputBT JTInput'></p>
</form>
<form id='f2'>
<textarea name='name2-1' id='id2-1' class='class1'></textarea>
<textarea name='name2-2' id='id2-2' class='class1'></textarea>
<p><input type='reset' value='Очистить' class='inputBT'>
<input type='submit' value='Сохранить' name='name2' id='BT2' class='inputBT JTInput'></p>
</form>
<script>
window.onload = function(){
var button = document.querySelectorAll('.JTInput');
for(var i = 0; i < button.length; i++){
button[i].onclick = searchForm;
}
function searchForm(){
var res = this.form;
alert(res.id);
}
}
</script>
</body>
</html>
|
рони,
Спасибо! |
| Часовой пояс GMT +3, время: 09:00. |