2016-07-12 5 views
-2

У меня есть кратные дивы, и я хочу, как я могу обнаружить DIV я щелкнул и получить значения входов от Div я нажалНесколько дивы с таким же именем тетив образует

<div class="Offers"> 
    <div class="txt"> 
    </div> 
    <div class="map"> 
    <form id="vmap" method="post"> 
     <input type=hidden id=idship value=64> 
     <input type=hidden id=iddate value=1254> 
     <button>View Map</button> 
    </form> 
    </div> 
</div> 
<div class="Offers"> 
    <div class="txt"> 
    </div> 
    <div class="map"> 
     <form id="vmap" method="post"> 
      <input type=hidden id=idship value=65> 
      <input type=hidden id=iddate value=1255> 
      <button>View Map</button> 
     </form> 
    </div> 
</div> 
<div class="Offers"> 
    <div class="txt"> 
    </div> 
    <div class="map"> 
     <form id="vmap" method="post"> 
      <input type=hidden id=idship value=66> 
      <input type=hidden id=iddate value=1256> 
      <button>View Map</button> 
     </form> 
    </div> 
</div> 

Как я могу обнаружить div Я щелкнул и получил правильные значения от входов?

+0

где ваш скрипт? –

+1

duplicate id's ... недействительный HTML. –

ответ

1
<!doctype html> 
<html lang="en"> 
<head> 
</head> 
<body> 
<div class="Offers"> 
    <div class="txt"> 
    </div> 
    <div class="map"> 
    <form id="vmap" method="post"> 
     <input type=hidden id=idship value=64> 
     <input type=hidden id=iddate value=1254> 
     <button>View Map</button> 
    </form> 
    </div> 
</div> 
<div class="Offers"> 
    <div class="txt"> 
    </div> 
    <div class="map"> 
     <form id="vmap" method="post"> 
      <input type=hidden id=idship value=65> 
      <input type=hidden id=iddate value=1255> 
      <button>View Map</button> 
     </form> 
    </div> 
</div> 
<div class="Offers"> 
    <div class="txt"> 
    </div> 
    <div class="map"> 
     <form id="vmap" method="post"> 
      <input type=hidden id=idship value=66> 
      <input type=hidden id=iddate value=1256> 
      <button>View Map</button> 
     </form> 
    </div> 
</div><script src="https://code.jquery.com/jquery-2.2.4.js" type="text/javascript"></script> 

<script> 
$(function() { 

$(".Offers .map button").on('click', function() { 
    var form=$(this).parent("form"); 
    var idship =form.find('#idship').val(); 
    var iddate =form.find('#iddate').val(); 
    alert(idship +"---------"+iddate); 
    }); 


}); 
</script> 
</body> 
</html> 
+0

Это работает !!! Благодаря!! – NARTONIC

0

Th html5 спецификация говорит

Атрибут ID задает уникальный идентификатор своего элемента (ID). Значение должно быть уникальным среди всех идентификаторов в домашнем поддереле элемента и должно содержать не менее одного символа. Значение не должно содержать символов пробела.

Если вы делаете каждый идентификатор уникален, легко выбрать именно то, что вы хотите в JQuery с

$("#ID-here").val()

0

Вот решение


 
$(document).ready(function(){ 
 
$('.map').click(function(){ 
 
\t var input1 = $(this).find('input#idship').val(); 
 
\t var input2 = $(this).find('input#iddate').val(); 
 
\t alert("input1 - "+input1+" input2 - "+input2); 
 
}); \t \t 
 
});
<div class="Offers"> 
 
    <div class="txt"> 
 
    </div> 
 
    <div class="map"> 
 
    <form id="vmap" method="post"> 
 
     <input type='hidden' id='idship' value='64'> 
 
     <input type='hidden' id='iddate' value='1254'> 
 
     <button>View Map</button> 
 
    </form> 
 
    </div> 
 
</div> 
 
<div class="Offers"> 
 
    <div class="txt"> 
 
    </div> 
 
    <div class="map"> 
 
     <form id="vmap" method="post"> 
 
      <input type='hidden' id='idship' value='65'> 
 
      <input type='hidden' id='iddate' value='1255'> 
 
      <button>View Map</button> 
 
     </form> 
 
    </div> 
 
</div> 
 
<div class="Offers"> 
 
    <div class="txt"> 
 
    </div> 
 
    <div class="map"> 
 
     <form id="vmap" method="post"> 
 
      <input type='hidden' id='idship' value='66'> 
 
      <input type='hidden' id='iddate' value='1256'> 
 
      <button>View Map</button> 
 
     </form> 
 
    </div> 
 
</div> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

Смежные вопросы