0
Я могу заставить свою функцию работать, когда она не находится внутри тега привязки, я знаю, как добавить событие onclick к ссылке, но ее не работает когда я беру это из моего лейбла, он показывает букву S, и я нажимаю на нее, она работает правильно, но я хочу, чтобы она работала с моей симпатичной радиокнопкой, а не буквами, какие-нибудь идеи? Пожалуйста и спасибоКак заставить мою функцию js работать с привязкой/радиокнопкой
function displayForm(c){
if(c.value.includes("youth")){
document.getElementById("adult").style.visibility='visible';
document.getElementById("youth").style.visibility='hidden';
}
else if(c.value.includes("ladies")){
document.getElementById("adult").style.visibility='hidden';
document.getElementById("youth").style.visibility='visible';
}
else if(c.value.includes("adult")){
document.getElementById("adult").style.visibility='hidden';
document.getElementById("youth").style.visibility='visible';}
else{
}
}
<div class="sizes">
<h3>Available sizes</h3>
<hr>
<h4>Youth Sizes</h4>
<%size_price.each do |item| %>
<%if item['size'] == "youth small" %>
<label for="<%=item['size']%>">
S
<input type="radio" id="<%=item['size']%>" name="size" value="youth small" class="size-input" data-price="<%=item['price']%>" onclick="displayForm(this)">
</label>
<%elsif item['size'] == "youth medium" %>
<label for="<%=item['size']%>">
<a href="#">M</a>
<input type="radio" id="<%=item['size']%>" name="size" value="youth medium" class="size-input" data-price="<%=item['price']%>">
</label>
.
<p style="visibility:hidden" id="adult">
Line 1: <input id="line1" name="line1" placeholder="Your custom message" type="text" maxlength="14" >
<br>
Line 2: <input id="line2" name="line2" placeholder="Your custom message" type="text" maxlength="14">
<br>
Line 3: <input id="line3" name="line3" placeholder="Your custom message" type="text" maxlength="14">
<br>
Line 4: <input id="line4" name="line4" placeholder="Your custom message" type="text" maxlength="14">
</p>
<p style="visibility:hidden" id="youth">
Line 1: <input id="line1" name="line1" placeholder="Your custom message" type="text" maxlength="14" >
<br>
Line 2: <input id="line2" name="line2" placeholder="Your custom message" type="text" maxlength="14">
<br>
Line 3: <input id="line3" name="line3" placeholder="Your custom message" type="text" maxlength="14">
<br>
Line 4: <input id="line4" name="line4" placeholder="Your custom message" type="text" maxlength="14">
</p>
как бы вы предпочли? Есть несколько способов сделать это. Вы хотите, чтобы ванильный JS или вы предпочитаете использовать jQuery? Кроме того, вы можете создать фрагмент или фрагмент для этого с помощью вашего рендеринга html, чтобы получить более быстрый ответ. – Knostradamus