2016-04-30 4 views
0

Я создал форму, которая идет что-то вроде этого:Изменить OnClick атрибут в полевых условиях

<form action="#" class="header_form clearfix"> 
 
<input type="text" placeholder="Enter Your Address" id="autocomplete"> 
 
<a href="#" class="btn" onclick="document.location='/address?address='+$('#autocomplete').val();return false;">Enter Your Address</a> 
 
</form>

Я хочу, чтобы поместить условие Javascript, чтобы проверить, если входной текст имеет текст перед тем, как кнопка будет иметь параметры onclick. Если у него нет текста на клавиатуре, кнопка onclick не включена. Как это сделать?

+0

Почему это так? Просто присоедините обработчик кликов к кнопке, используя 'addEventListener'. Когда вы слушатель вызывается, проверьте, есть ли текст ввода текста и отвечайте соответствующим образом. –

+0

@RayNicholus, как это сделать? можете ли вы включить код, как это сделать? -newb здесь – TheDon

ответ

1

Если вы используете JQuery, вы могли бы сделать что-то вроде этого:

$('.btn').on('click', function() { 
    var email = $.trim($('#autocomplete').val()); 
    if(email.length) { 
    window.location = '/address?address='+email; 
    } else { 
    alert('Enter your email first'); 
    } 
}); 

$ .trim является там, по крайней мере, не допустить пустые пространства запускающих действительные представить.
В любом случае вы бы лучше пойти с EMAIL рисунком регулярного выражения: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp/test

+0

именно то, что мне нужно спасибо! – TheDon

-1

Это будет отключить ссылку, если его не правильный адрес электронной почты слишком

<!DOCTYPE html> 
<html> 

    <head> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script> 
    </head> 

    <body> 
    <script type="text/javascript"> 

     function validateEmail(email) { 
     var re = /^(([^<>()\[\]\\.,;:\[email protected]"]+(\.[^<>()\[\]\\.,;:\[email protected]"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/; 
     return re.test(email); 
     } 

     $(document).ready(function() { 
     $('#autocomplete').bind('input', function() { 
      if ($(this).val().trim().length === 0) { 
      document.getElementById('myButton').removeAttribute('href'); 
      } else { 
      if (validateEmail(document.getElementById("autocomplete").value) === true) { 
       document.getElementById('myButton').setAttribute("href",'/address?address=' + document.getElementById("autocomplete").value); 
      } else { 
       document.getElementById('myButton').removeAttribute('href'); 
      } 
      } 
     }); 
     document.getElementById('myButton').removeAttribute('href'); 
     }); 
    </script> 

    <form action="#" class="header_form clearfix"> 
     <input type="text" placeholder="Enter Your Address" id="autocomplete" /> 
     <a href="#" id="myButton" name="myButton" class="btn">Enter Your Address</a> 
    </form> 
    </body> 
</html> 
+0

Почему downvote? В вопросе говорится, что «перед тем, как кнопка будет иметь параметры onclick», которую я предполагаю, следует отключить сам клик, если на входе нет действительного адреса электронной почты. Может ли умный Как дать причину, а затем downvote вместо того, чтобы идти на кнопку downvote, как безумный бык? –

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