Estoy tratando de obtener la fecha de un botón y mostrarla en otro div. Intenté usar el método de etiqueta de entrada pero no funcionó. Así que traté de usar la opción de botón con ícono y mi problema es cómo puedo obtener el fecha y mostrarlo en otro lugar.
<button type="button" class="btn btn-icon btn-primary w-full" id="date" data-plugin="datepicker"> <i class="icon wb-calendar" aria-hidden="true"> </i></button> <div id="show-date"></div>aquí está mi js
$(function() { var showdate = document.getElementById( 'show-date' ); $("#date").datepicker(); $("#date").on("change",function(){ var selected = $(this).val(); showdate.selected.show; }); });Hay varios problemas con su código, primero un botón no puede activar el evento de cambio, tiene que ser changeDate .
En segundo lugar, para obtener la fecha, debe usar ev.date ya que el valor de los botones no se actualizará en el evento changeDate.
$(function() { var showdate = $("#show-date") $("#date").datepicker().on('changeDate', function(ev) { var selected = ev.date showdate.text(selected) }); });Manifestación
$(function() { var showdate = $("#show-date") $("#date").datepicker().on('changeDate', function(ev) { var date = new Date(ev.date); var selected = ((date.getMonth() > 8) ? (date.getMonth() + 1) : ('0' + (date.getMonth() + 1))) + '/' + ((date.getDate() > 9) ? date.getDate() : ('0' + date.getDate())) + '/' + date.getFullYear() showdate.text(selected) }); }); <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.9.0/css/bootstrap-datepicker.min.css" integrity="sha512-mSYUmp1HYZDFaVKK//63EcZq4iFWFjxSL+Z3T/aCt4IO9Cejm03q3NKKYN6pFQzY0SBOr8h+eCIAZHPXcpZaNw==" crossorigin="anonymous" referrerpolicy="no-referrer" /> <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.9.0/js/bootstrap-datepicker.min.js" integrity="sha512-T/tUfKSV1bihCnd+MxKD0Hm1uBBroVYBOYSk1knyvQ9VyZJpc/ALb4P0r6ubwVPSGB2GvjeoMAJJImBG12TiaQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script> <button type="button" class="btn btn-icon btn-primary w-full" id="date" data-plugin="datepicker"> <i class="icon wb-calendar" aria-hidden="true"> </i></button> <div id="show-date"></div>