Как отредактировать значение 3 метки после нажатия на HREF с Javascript?

Question

Как отредактировать значение 3 метки после нажатия на HREF с Javascript?

0

Я хочу сделать три разных ярлыка для редактирования, когда я нажимаю на один href
У меня есть:

<tr>
    <td align="left">PLZ:</td>

    <td>
        <label for="name" class="control-label">
            <p class="text-info">
                <label style="color: #662819;" id="plz"></label>
                <i class="icon-star"></i>
            </p>
        </label>
        <input type="text" class="edit-input" />

        <div class="controls">
            <a class="edit" href="#">Daten sichern</a>
        </div>
    </td>
</tr>

изменив эту метку на:

CSS:

.edit-input {
    display:none;
}

JQuery:

$(function() {
    $('a.edit').on("click", function(e) {
        e.preventDefault();
        var dad = $(this).parent().parent();
        var lbl = dad.find('label');
        lbl.hide();
        dad.find('input[type="text"]').val(lbl.text()).show().focus();
    });

    $('input[type=text]').focusout(function() {
        var dad = $(this).parent();
        $(this).hide();
        dad.find('label').text(this.value).show();
    });
});

как сделать это для 2 или более ярлыков??? как для последующих...:

<tr>
      <td align="left">Strasse:</td>
      <td>
        <label for="name" class="control-label">
            <p class="text-info">
                <label style="color: #662819;" id="street"></label>
                <i class="icon-star"></i>
            </p>
        </label>
        <input type="text" class="edit-input" />  
      </td>
</tr>

и так далее...

r.r 21 сен. 2013, в 00:05

Источник

Теги:

javascript

jquery

label

textbox

1 ответ

Ещё вопросы

conca · Accepted Answer · 2013-09-20T19-15-00.000Z

Чтобы сделать разные метки одновременно редактируемыми, при нажатии одной ссылки вы можете использовать каждую функцию JQuery, как показано в следующем коде:

$('a.edit').on('click',function(e){
    e.preventDefault();

    //Search for .control-label items
    $('label.control-label').each(function(key,item){
        var label = $(item);          
        label.hide();
        label.siblings('input.edit-input').val(label.text()).show().focus();
    });

});

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

эй, твой метод делает только последний ярлык из 3 редактируемых ... первые 2 игнорируются.
Все ваши ярлыки имеют class='control-label' ?
у вас есть JSFiddle или что-то, чтобы посмотреть код. Код ответа может работать: S