jQuery codes for javascript

Asked

Viewed 339 times

1

I’m having problems, Javascript is very confusing for me, let’s see that I have a function that performs all this in jQuery

$(".message-form-content").attr('style', ' '); // Esvazia o style da div
$("#load-content").html(success); // Preenche com o sucess da funcao
$("#imageForm").reset(); // Reseta o formulario
$("#post9999999999").val(''); // da empty na textarea
$("#post9999999999").focus(); // Focaliza na textarea
$("#queued-files").html("0"); // Poe valor 0
$(".selected-files").fadeOut(600); // Desaparece em fadeout
$("div.timeago").timeago(); // Renove
return true;

I need to turn all this into Javascript, because in the file where the function is pulled can not exist jQuery

javascript jquery html

2 answers

6


Okay... here it comes, 'cause Christmas is right around the corner :)

$(".message-form-content"). attr('style', ' ');

var elementos = document.querySelectorAll(".message-form-content");
for (var i = 0; i < elementos.length; i++){
    elementos[i].style = '';
}

$("#load-content"). html(Success);

document.getElementById('load-content').innerHTML = success;

$("#imageForm"). reset();

document.getElementById('imageForm').reset();

$("#post9999999999"). val('');

document.getElementById('post9999999999').value = '';

$("#post9999999999"). Focus();

document.getElementById('post9999999999').focus();

$("#queued-files"). html("0");

document.getElementById('queued-files').innerHTML = "0";
// repare que assim como tinha é string, pode tamber fazer .innerHTML = "0" para ter Type Number

$(".Selected-files"). fadeOut(600);

Note: can (and should!) do this with CSS, there are already answers about it here at Sopt.
But in JS I think there is no, exmeplo live: http://jsfiddle.net/0sxqnnc0/.

var elementos = document.querySelectorAll('.selected-files');
for (var i = 0; i < elementos.length; i++) {
    elementos[i].style.opacity = 1;
    fade(elementos[i], 600);
}

function fade(el, duracao) {
    if ((el.style.opacity -= 40 / duracao) < 0) el.style.display = "none";
    else setTimeout(function () {
        fade(el, duracao);
    }, 40);
}

$("div.timeago"). timeago();

This one has to ask a question apart :) It has to explain better which plugin is and what function does.

  • 2

    In that reply, coincidentally, the script used to demonstrate the solution is jQuery Timeago, which converts a date to the notation of "X days ago" or "X minutes ago".

  • 1

    @Brunoaugusto good! I see I had already given +1 in that reply... If anyone else reads this may go +1 just for me :)

  • 1

    @Sergio Obrigado..

  • 1

    EDIT: to empty the style I chose to exchange the code for: document.getElementById('message-form-content').removeAttribute("style");

3

Buddy, I don’t think anyone’s gonna convert all this for you.

Many of the things jQuery does is actually very simple to do with Javascript only.

I put here some pages for you to search:

  • youmightnotneedjquery.com
  • github.com/jquery/jquery (jQuery source code)
  • github.com/mootools/mootools-core (Mootools source code)

I particularly like to rummage through the source code of certain libraries, and I’m often surprised how simple it is to do certain things.

  • 3

    +1 for placing the link http://youmightnotneedjquery.com/ !

Browser other questions tagged javascript jquery html

You are not signed in. Login or sign up in order to post.