0

HTML

<div id="mdCalendar-body" class="mdCalendar-body">
<table class="cal-table">
<thead><tr><td class="days-title">L</td><td class="days-title">M</td><td class="days-title">M</td><td class="days-title">J</td><td class="days-title">V</td><td class="days-title">S</td><td class="days-title">D</td></tr></thead>


<tbody class="bodyCalendartable">
    <tr>
        <td class="day not-day" data-month="10" data-year="2018" data-day="01" data-maxday="3">
        <label>1</label>
        <span class="precio">3,879</span>
        <span class="llegada">Llegada</span>
        <span class="final">Salida</span>
        </td>
    </tr>
</tbody>    
</table>
</div>

Javascript

$('body').on('mouseover', '.day', function () {
            rangeDatePaquete("#MDcalendar-container", $(this));

        });




var rangeDatePaquete = function (id, x) {
        var koin = $(id).find(".cal-table").find(".bodyCalendartable");

        var fday = getDate(x.attr("data-day") + "/" + x.attr("data-month") + "/" + x.attr("data-year"));
        var mxd = x.attr("data-maxday");/// recupera el valor de dias que contempla

        koin.find(".day,.day-old").removeClass("dateHover").removeClass("dateHoverEnd").removeClass("dateHoverDanger").removeClass("dateHoverStart").removeClass("base-cHover").removeClass("base-bHover");// limpia
        if (!x.hasClass("not-day")) {
            var type = x.attr("class");
            var res = type.split(" ");
            console.log(res[1]);

        }
    }

En la funcion rangeDate, quiero recuperar el texto que tiene el span .precio, sé que es por selectores jquery, yo intenté esto en la función rangeDate

var price = $(x+"> span.precio").text();

pero no me funciona y creo que es por la sintaxis que no estoy escribiendo correctamente

0

1 respuesta 1

0

Según veo, x contiene el elemento donde se hace el evento mouseover que es el <td> con la clase day, cuando tratas de obtener la clase de esta forma:

var price = $(x+"> span.precio").text();

x devuelve el objeto completo day. Entonces, si quieres obtener la clase sería de esta forma (debesprevenir cuando el elemento tiene mas de una clase, debes concatenar las clases con puntos):

price = $("."+x.attr('class').split(/[ ,]+/).join('.')+"> span.precio").text();

el selector seria algo así:

.day.not-day > span.precio

Otra forma de hacerlo es con children:

var price = x.children("span.precio").text();

$('body').on('mouseover', '.day', function() {
  rangeDatePaquete("#MDcalendar-container", $(this));
});

var rangeDatePaquete = function(id, x) {
    var price = x.children("span.precio").text();
    console.log("con children: "+price);
    
    price = "";
    price = $("."+x.attr('class').split(/[ ,]+/).join('.')+"> span.precio").text();
    console.log("con class: "+price);


}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="mdCalendar-body" class="mdCalendar-body">
  <table class="cal-table">
    <thead>
      <tr>
        <td class="days-title">L</td>
        <td class="days-title">M</td>
        <td class="days-title">M</td>
        <td class="days-title">J</td>
        <td class="days-title">V</td>
        <td class="days-title">S</td>
        <td class="days-title">D</td>
      </tr>
    </thead>


    <tbody class="bodyCalendartable">
      <tr>
        <td class="day not-day" data-month="10" data-year="2018" data-day="01" data-maxday="3">
          <label>1</label>
          <span class="precio">3,879</span>
          <span class="llegada">Llegada</span>
          <span class="final">Salida</span>
        </td>
      </tr>
    </tbody>
  </table>
</div>

3
  • No me marca error, pero no me muestra nada cuando imprimo en la consola price Commented el 26 oct. 2018 a las 15:23
  • revisa la respuesta, funciona con las dos soluciones que te he propuesto
    – Rene Limon
    Commented el 26 oct. 2018 a las 15:32
  • sin duda alguna, no conocia el selector children, todo el tiempo usé el "menor que" Commented el 26 oct. 2018 a las 16:02

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.