Tenho este código:
$(document).ready(function(){
$("[name='valor1']").on('blur',function(){
$(".empresa1").text($(this).val());
$(".valor1").val($(this).val());
});
$("[name='valor2']").on('blur',function(){
$(".empresa2").text($('[name="valor2"]').val());
$(".valor2").val($('[name="valor2"]').val());
});
$("[name='valor3']").on('blur',function(){
$(".empresa3").text($('[name="valor3"]').val());
$(".valor3").val($('[name="valor3"]').val());
});
$("[name='empresa1']").on('click',function(){
alert($(this).val());
});
$("[name='empresa2']").on('click',function(){
alert($(this).val());
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" name="valor1" value=""/>
<input type="text" name="valor2" value=""/>
<input type="text" name="valor3" value=""/>
<BR/><BR/><BR/>
<label class="empresa1"></label><input type="radio" name="empresa1" class="valor1" val=""/>
<label class="empresa2"></label><input type="radio" name="empresa1" class="valor2" val=""/>
<label class="empresa3"></label><input type="radio" name="empresa1" class="valor3" val=""/>
<BR/>
<label class="empresa1"></label><input type="radio" name="empresa2" class="valor1" val=""/>
<label class="empresa2"></label><input type="radio" name="empresa2" class="valor2" val=""/>
<label class="empresa3"></label><input type="radio" name="empresa2" class="valor3" val=""/>
A ideia é preencher os 3 inputs, popular o value do input radio e escrever o texto digitado nos labels.
O problema: se eu não digitar nenhum valor e clicar em um dos radio buttons, é impresso o valor "on"
.
Entrem no jsfiddle que fiz acima, apertem o radio button sem digitar nada e verifiquem o alert
que irá aparecer, por que isso? Tem como deixar ele vazio?