jquery заменить текст span без разрушения внутреннего div - PullRequest
Новая
       7

jquery заменить текст span без разрушения внутреннего div

0 голосов
/ 21 октября 2011

У меня есть проблема, когда мне нужно заменить текст в промежутке другим текстом, при этом не уничтожая вложенный div.

Обычно, когда я использую метод .html(), внутренний div перезаписывается, и он исчезает.

Код ниже и также на jsfiddle.net 

    .textLabel {

        font-size: 11px;
        font-weight: 200;
        letter-spacing:1px;
        position: absolute;
        width: auto;
        height: 33px;
        line-height: 32px;
        background-color: rgba(0,0,0, 1);
        -moz-border-radius: 17px;
        -webkit-border-radius: 17px;
        border-radius: 17px;
        color: white;
        text-align: left;
        padding-left: 44px;
        padding-right: 20px;
    }

    .circ 
    {
        position: absolute;
        top: 50%;
        margin-top: -10px;
            left: 7px;
        width: 13px;
        height: 13px;
        background-color: white;
        -moz-border-radius: 11px;
        -webkit-border-radius: 11px;
        border-radius: 11px;
        border: solid 4px black;
        cursor:pointer;
    }

    .circ:hover 
    {
        position: absolute;
        /*top: 50%;*/
        margin-top:-20px;
        margin-left:-13px;

        width: 31px;
        height: 31px;
        background-color: blue;
        -moz-border-radius: 22px;
        -webkit-border-radius: 22px;
        border-radius: 22px;
        border: solid 6px white;
    }

    var otherText = "This is some other text";
            var noText = "";
            var spanID = "#s1";

            $("#b1").hover(function() {

              $(spanID).html(otherText);

            }, function() {

              $(spanID).html(noText);

            });

В этом примере при наведении курсора на элемент div с идентификатором «b1» он исчезает из документа.

Что я делаю не так?

Ответы [ 2 ]

1 голос
/ 21 октября 2011

Другим способом было бы просто поместить текст в промежуток и затем использовать text или html.

Обновлено скрипка

0 голосов
/ 21 октября 2011

Вы можете отсоединить промежуток, заменить HTML, а затем снова прикрепить промежуток следующим образом: 

$("#b1").hover(function(){
    var store = $('#b1', spanID).detach();
    $(spanID).html(otherText);
    $(spanID).append(store);

}, function() {
    var store = $('#b1', spanID).detach();
    $(spanID).html(noText);
    $(spanID).append(store);
});

Разветвленная скрипка: http://jsfiddle.net/wzZSx/1/

Надеюсь, это поможет!

...