Hola comunidad tengo el siguiente lío, resulta que en mi web tengo un menu que carga en un contenedor mediante AJAX otras paginas. El problema esta al cargar el formulario, no aparece el reCaptcha. Al visualizar el formulario "contacto.html" en si, este si aparece, pero al cargarlo desde el "index.html" no lo carga.
index.html
<nav class="menu">
<ul id="listaMenu">
<li class="nav-item" id="btn_inicio">Inicio</li>
<li class="nav-item" id="btn_servicios">Servicios</li>
<li class="nav-item" id="btn_portafolio">Portafolio</li>
<li class="nav-item" id="btn_contacto">Contacto</li>
</ul>
<div class="menu-bar">Menu
<span class="hamburger-icon"><i class="fa fa-bars"></i></span>
</div>
</nav>
<div class="contenedor" id="id_contenedor">
<div class="marco" id="id_marco">
<!--NOTE En este div cargo el contenido-->
</div>
</div>
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js">
</script>
<!--NOTE script de carga de contenido en un div-->
<script type="text/javascript">
$(document).ready(function() {
$('#btn_inicio').on('click', function() {
window.location.href = '/'
});
$('#btn_servicios').on('click', function() {
$('.navbar-nav li').removeClass('active');
$("#id_marco").load('inc/servicios.html');
return false;
});
$('#btn_portafolio').on('click', function() {
$('.navbar-nav li').removeClass('active');
$("#id_marco").load('inc/portafolio.html');
return false;
});
$('#btn_contacto').on('click', function() {
$('.navbar-nav li').removeClass('active');
$("#id_marco").load('inc/contacto.html');
return false;
});
});
</script>
contacto.html
<head>
<script src="https://www.google.com/recaptcha/api.js" async defer></script>
</head>
<form name="formulario" action="/enviarform.php" method="post" onsubmit="return validar()">
<!--NOTE Algunos inputs-->
<div class="g-recaptcha" data-sitekey="__SITE KEY__">
</div>
<div class="buttonHolder">
<input type="submit" value="Enviar" class="btnEnviar">
</div>
</form>