Div içeriğini değiştir - jQuery

LINKS'lerden biri tıklandığında bu div'in içeriğini değiştirmek nasıl mümkün olabilir?

<div align="center" id="content-container">
    <a href="#" class="click cgreen">Main Balance</a>
    <a href="#" class="click cgreen">PayPal</a>
    <a href="#" class="click cgreen">AlertPay</a>
</div>

Bağlantılar için .click olayına abone olabilir ve şu .htmlyöntemi kullanarak div içeriğini değiştirebilirsiniz :

$('.click').click(function() {
    // get the contents of the link that was clicked
    var linkText = $(this).text();

    // replace the contents of the div with the link text
    $('#content-container').html(linkText);

    // cancel the default action of the link by returning false
    return false;
});

Bununla birlikte, bu div'in içeriğini değiştirirseniz, atadığınız tıklama işleyicisinin yok edileceğini unutmayın. Olay işleyicileri eklemeniz gereken div içine bazı yeni DOM öğelerini enjekte etmeyi düşünüyorsanız, bu ekler yeni içerikler eklendikten sonra .click işleyicisinin içinde gerçekleştirilmelidir. Olayın orijinal seçicisi .delegatekorunursa, işleyiciyi ekleme yöntemine de göz atabilirsiniz .

Burada kullanmak isteyeceğiniz 2 jQuery işlevi vardır.

1) click. Bu, tek parametre olarak anonim bir işlevi alacak ve öğe tıklandığında onu çalıştıracaktır.

2) html. Bu, tek parametresi olarak bir html dizesi alacak ve öğenizin içeriğini sağlanan html ile değiştirecektir.

Dolayısıyla, sizin durumunuzda aşağıdakileri yapmak isteyeceksiniz:

$('#content-container a').click(function(e){
    $(this).parent().html('<a href="#">I\'m a new link</a>');
    e.preventDefault();
});

Div'inizdeki her şeyi değiştirmek yerine yalnızca içerik eklemek istiyorsanız, şunu kullanmalısınız append:

$('#content-container a').click(function(e){
    $(this).parent().append('<a href="#">I\'m a new link</a>');
    e.preventDefault();
});

Yeni eklenen bağlantıların tıklandığında yeni içerik de eklemesini istiyorsanız, olay yetkilendirmesini kullanmalısınız :

$('#content-container').on('click', 'a', function(e){
    $(this).parent().append('<a href="#">I\'m a new link</a>');
    e.preventDefault();
});

$('a').click(function(){
 $('#content-container').html('My content here :-)');
});

Aynı şeyi replaceewith () ile deneyebilirsiniz.

$('.click').click(function() {
    // get the contents of the link that was clicked
    var linkText = $(this).text();

    // replace the contents of the div with the link text
    $('#content-container').replaceWith(linkText);

    // cancel the default action of the link by returning false
    return false;
});

.replaceWith()Yöntem, tek bir çağrı ile yerine DOM ve ek yeni ait içeriğe kaldırır.

JQuery kullanarak div içeriğini değiştirmek için bunu deneyin.

Daha fazlasını görün @ jQuery kullanarak div içeriğini değiştirin

$(document).ready(function(){
    $("#Textarea").keyup(function(){
        // Getting the current value of textarea
        var currentText = $(this).val();

        // Setting the Div content
        $(".output").text(currentText);
    });
});

Deneyin $('#score_here').html=total;