desarrolladores necesito ayuda con jQuery. Tengo una lista de casillas de verificación y solo quiero que se muestren ciertas casillas de verificación en la página. Actualmente, Mi código muestra solo la casilla de verificación de la fecha actual, pero necesito más controles. Esto es lo que quiero
A continuación se muestra mi enfoque, pero no dude en ayudarme a su manera/código. No es necesario que vayas necesariamente con mi código.
$('[data-fieldlabel=\'Date and Price\'] span').each(function() { const date = new Date(); const today = (date.getMonth() + 1) + '/' + date.getDate() + '/' + date.getFullYear().toString().slice(-2); const currentDateEl = $(this).find('.check-box-label').text(); if (!currentDateEl.startsWith(today)) { $(this).hide(); } });
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script> <div class="checkbox-group" data-fieldlabel="Date and Price"> <span class="checkbox custom-checkbox custom-check-box"> <input id="field_13646002_25035125" type="checkbox"/> <label class="check-box-label" for="field_13646002_25035125">10/9/21 - 8.50</label> </span> <span class="checkbox custom-checkbox custom-check-box"> <input id="field_13646002_25035126" type="checkbox"/> <label class="check-box-label" for="field_13646002_25035126">10/16/21 - 2.00</label> </span> <span class="checkbox custom-checkbox custom-check-box"> <input id="field_13646002_25035126" type="checkbox"/> <label class="check-box-label" for="field_13646002_25035126">10/28/21 - 3.00</label> </span> </div>
Necesito una verificación más. Si no tengo la fecha actual (quiero mostrar una fecha futura más cercana), digamos que la fecha de hoy es el 28/10/21, pero tengo la etiqueta debajo
<label class="check-box-label" for="field_13646002_25035126">10/27/21 - 3.00</label> <label class="check-box-label" for="field_13646002_25035126">10/29/21 - 3.00</label> <label class="check-box-label" for="field_13646002_25035126">10/30/21 - 3.00</label>
Ahora quiero mostrar solo estos datos futuros más cercanos <label class="check-box-label" for="field_13646002_25035126">10/29/21 - 3.00</label>
El siguiente código puede ser lo que necesita:
let now=new Date(); now.setHours(0); now.setMinutes(0); now.setSeconds(0); let nowTime=now.getTime(); let items=$('[data-fieldlabel=\'Date and Price\'] span'); let index=-1; for (let i=0;i<items.length;i++){ let theDate=($(items[i]).find('.check-box-label').text()).split(" ")[0]; let theDateObj=new Date(theDate); let diff=theDateObj.getTime()-nowTime; if (diff>=0){ if (index==-1){ index=i; break; } } } for (let i=0;i<items.length;i++){ if (i!=index){ $(items[i]).hide(); } }
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div class="checkbox-group" data-fieldlabel="Date and Price"> <span class="checkbox custom-checkbox custom-check-box"> <input id="field_13646002_25035126" type="checkbox" /> <label class="check-box-label" for="field_13646002_25035126">10/29/21 - 3.00</label> </span> <span class="checkbox custom-checkbox custom-check-box"> <input id="field_13646002_25035126" type="checkbox" /> <label class="check-box-label" for="field_13646002_25035126">10/30/21 - 3.00</label> </span> <span class="checkbox custom-checkbox custom-check-box"> <input id="field_13646002_25035126" type="checkbox" /> <label class="check-box-label" for="field_13646002_25035126">10/28/21 - 3.00</label> </span> </div>