Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   Застрял на простом (https://javascript.ru/forum/jquery/70314-zastryal-na-prostom.html)

WarDoctor 26.08.2017 20:17

Застрял на простом
 
Есть набор элементов input. Необходимо при клике на любом, независимо от типа элемента, в поле data-debug вывести его значение data-fname или id.
<input type="text" data-fname="number" id="acc_number"><br>
<input type="text" data-fname="date" id="acc_date"><br>
<input type="text" data-fname="name" id="acc_munit"><br>
<input type="text" data-fname="dislt" id="acc_tlocal"><br>
<input type="text" data-fname="disln" id="acc_loc"><br>
<input type="text" data-fname="disla" id="acc_obl"><br>
<input type="text" data-fname="objects" id="acc_objects"><br>
<input type="text" data-fname="laborators" id="acc_laborators"><br>
<input type="text" data-fname="types" id="acc_types"><br>
<input type="text" data-fname="materials" id="acc_materials"><br>
<input type="text" data-fname="study" id="acc_study">
<hr>
<div data-debug> Data-Fname / ID </div>

var acc_id = '';
$( '[id^="' + prefix_acc + '"]' ).live('click', function() {
	var acc_id = $( this ).attr( "id" );
  return acc_id;
});
$( "[data-debug]" ).text( acc_id );

PS: просьба сильно не ругаться... сам знаю что затупил :haha:

рони 26.08.2017 20:25

WarDoctor,
<!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() {
var prefix_acc = 'acc_';
$( '[id^="' + prefix_acc + '"]' ).on('click', function() {
$( "[data-debug]" ).text( [this.dataset.fname, this.id].join(' / ') );
});


});
  </script>
</head>

<body>
<input type="text" data-fname="number" id="acc_number"><br>
<input type="text" data-fname="date" id="acc_date"><br>
<input type="text" data-fname="name" id="acc_munit"><br>
<input type="text" data-fname="dislt" id="acc_tlocal"><br>
<input type="text" data-fname="disln" id="acc_loc"><br>
<input type="text" data-fname="disla" id="acc_obl"><br>
<input type="text" data-fname="objects" id="acc_objects"><br>
<input type="text" data-fname="laborators" id="acc_laborators"><br>
<input type="text" data-fname="types" id="acc_types"><br>
<input type="text" data-fname="materials" id="acc_materials"><br>
<input type="text" data-fname="study" id="acc_study">
<hr>
<div data-debug> Data-Fname / ID </div>

</body>
</html>

WarDoctor 26.08.2017 21:23

рони, спасибо.
желательно чтобы выводилось что-то одно. подскажите каким образом это сделать?
Переменная acc_id в последующем коде должна быть использована, поэтому проверка ее значения и вынесена за пределы обработчика т.к. есть функции где с этой переменной будут произведены преобразования

извините за вредность:stop:

рони 26.08.2017 21:34

WarDoctor,
Цитата:

Сообщение от WarDoctor
желательно чтобы выводилось что-то одно

:blink:
$( "[data-debug]" ).text( [this.dataset.fname, this.id].join(' / ') );

заменить на
$( "[data-debug]" ).text( this.dataset.fname );

или на
$( "[data-debug]" ).text(  this.id);

:(

WarDoctor 27.08.2017 00:22

Цитата:

Сообщение от рони (Сообщение 462810)
WarDoctor,

:blink:
$( "[data-debug]" ).text( [this.dataset.fname, this.id].join(' / ') );

заменить на
$( "[data-debug]" ).text( this.dataset.fname );

или на
$( "[data-debug]" ).text(  this.id);

:(

спасибо. так понятнее.
как реализовать основную мысль: переменная acc_id и результат обработчика должны быть доступны за пределами самого обработчика т.к. в последующем возвращённое обработчиком значение переменной используется в другом месте кода
именно с этим проблема

WarDoctor 27.08.2017 10:41

Решение найдено.
Спасибо за помощь в нахождении решения.
var prefix_acc = 'acc_';
$(function() {
  $('[id^="' + prefix_acc + '"]').click(function() {
    var id_acc = $(this).attr("id");
    //var id_acc = $(this).data("fname");
    MyFunction(id_acc);
  });

  function MyFunction(inp_id) {
    //код выполнения
    $("[data-debug]").text(inp_id);
  }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input type="text" data-fname="number" id="acc_number"><br>
<input type="text" data-fname="date" id="acc_date"><br>
<input type="text" data-fname="name" id="acc_munit"><br>
<input type="text" data-fname="dislt" id="acc_tlocal"><br>
<input type="text" data-fname="disln" id="acc_loc"><br>
<input type="text" data-fname="disla" id="acc_obl"><br>
<input type="text" data-fname="objects" id="acc_objects"><br>
<input type="text" data-fname="laborators" id="acc_laborators"><br>
<input type="text" data-fname="types" id="acc_types"><br>
<input type="text" data-fname="materials" id="acc_materials"><br>
<input type="text" data-fname="study" id="acc_study">
<hr>
<div data-debug> Data-Fname / ID </div>

laimas 27.08.2017 12:11

Цитата:

Сообщение от WarDoctor
Решение найдено.

Очень неразумное решение.

WarDoctor 01.11.2017 22:09

Цитата:

Сообщение от laimas (Сообщение 462840)
Очень неразумное решение.

Если это неразумно, то предложите свой вариант. Доброй рекомендацией всегда буду рад пополнить свои скудные знания...

laimas 01.11.2017 22:11

Цитата:

Сообщение от WarDoctor
Если это неразумно, то предложите свой вариант.

Ну наверное как-то иначе определять группы.


Часовой пояс GMT +3, время: 23:05.