insert variable JS in html

0

I would like to pass the value of the variable visits of the document ready to the html code of <li class>

 $(document).ready(function(){
         visitas="active";
        });

    <div id="cursor">
             <ul class="nav nav-tabs">
        <li class="visitas"><a  data-toggle="tab"  onclick="visitasF(pagActual,idFinca); return false;">Visitas 
               T&eacute;cnico</a></li>
            </ul>
            </div>
    
asked by Lorenzo Martín 03.07.2018 в 12:40
source

2 answers

3

You can use the addClass() function to add a class. Just like if you want to remove a class you can use the function removeClass() .

$('.visitas').addClass(visitas);
    
answered by 03.07.2018 / 13:01
source
2

Case 1: If you mean to make the link within the element is non-clickeable , and activated using jQuery, it is appropriate to comment that the active or inactive attribute corresponds to elements of type input :

For example:

<input class="mi_texto" type="text" disabled="disabled"/>

In which case it would be

$(document).ready(function() {
    $('.mi_texto').removeAttr('disabled');
));

But today some frameworks like Bootstrap allow you to mark an arbitrary element as inactive (not clickable) by adding the class disabled . I guess you try to do something similar.

In that case you would use:

 $(document).ready(function(){
     $('.visitas').addClass("activo");
 });

And make sure that the class activo has priority over the class that marks it as inactive.

Or:

 $(document).ready(function(){
     $('.visitas').removeClass("disabled");
 });

Case 2:

If you mean insert the value of an arbitrary variable into an element of the DOM , then you can use a data attribute:

var variable_cualquiera='cualquier cosa incluso un objeto';

$('.visitas').data('mi-atributo', variable_cualquiera);

And then retrieve it as

var variable_almacenada = $('.visitas').data('mi-atributo');

The advantage of using a data attibute, as it says above, is that you can store in it what you want, not just text.

Service Pack

In case anyone gets the question, how do you do, for example, bootstrap to make an element not input (eg link, div, span etc) appear as inactive, adding the class inactive or disabled ?

It would be done using pointer-events

.inactive {
   opacity: 0.7;
   color: #AAA;
   pointer-events:none;
}

With that the element does not receive clicks. In the case of the question asked by the OP, we would have to assume that the element li starts with that style, and by adding "active" the pointer-events is reset.

    
answered by 03.07.2018 в 13:00