Jquery, как избежать кавычек

Question

Я использую простой код jquery, который захватывает HTML-код формы из тега, а затем помещает это содержимое в форму ввода

<td class="name_cat" ><span class="name_cat">It&#039;s a &quot;test&quot; </span> (5)</td>

jquery получает содержимое в span.name_cat и возвращает его как It's a "test".Поэтому, когда я печатаю это на входе, оно становится

<input value="It's a "test"" />

, которое, как вы можете себе представить, будет отображаться только как It's a, следующая двойная кавычка закроет тег значения.Какой трюк здесь, чтобы сохранить исходную строку, не показывая код utf8 во входных данных?

Код Jquery

            $(".edit_cat").click(function(){

            tr = $(this).parents("tr:first");
            id_cat = $(this).attr("id");
            td_name = tr.find(".name_cat");
            span_name = tr.find("span.name_cat").html();
            form = '<form action="/admin/controllers/edit_cat.php" method="post" >'+
                            '<input type="hidden" name="id_cat" value="'+id_cat+'" />'+
                            '<input type="text" name="name_cat" value="'+span_name+'" />'+
                            '<input type="submit" value="save" />'+
                            '</form>';
            td_name.html(form);

            console.log(span_name);


        }
        );

Мне в основном нужно html(), чтобы не декодировать Utf8

Answer 1

Я считаю, что это должно позаботиться об этом для вас.

var span_name = tr.find("span.name_cat").html().replace(/"/g, """);

Пример: http://jsfiddle.net/yzthA/

Кроме того, не забудьте объявить переменные с помощью var, если вы этого не сделали.

Answer 2

Вы можете построить форму такой, какая вы есть, но пройти через объект формы с помощью контекста jQuery

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.js"></script>

<script type="text/javascript">
$(function() {
    $('#go').click(function() { 
        var tester = $('<div></div>').html('It&#039;s a &quot;test&quot;');
        var form = $('<form action="/admin/controllers/edit_cat.php" method="post" >' +
                    '<input type="hidden" name="id_cat" />' +
                    '<input type="text" name="name_cat" />' +
                    '<input type="submit" value="save" />' +
                    '</form>');
        $(':hidden:first', form).attr('value', tester.text());
        $(':text:first', form).attr('value', "Some attribute");

        $('#output').append(form);
    });
});
</script>
<input id="go" type="submit" value="click"/>
<div id="output">
</div>

То, что я здесь сделал, заключает в себе ввод html формы в объект jQuery как * 1004.*.Затем вы можете запрашивать элементы в контексте этого объекта с помощью мало используемой формы jQuery:

jQuery (селектор, [контекст])
селектор: строка, содержащаявыражение селектора
context: элемент DOM, Document или jQuery для использования в качестве контекста

edit: я создал объект tester и установил содержимое в качестве примера html.Затем, когда я устанавливаю значение в скрытом вводе, я вызываю .text(), чтобы получить не-HTML представление.Значение такое же, как и ожидалось.

<form action="/admin/controllers/edit_cat.php" method="post">
    <input type="hidden" name="id_cat" value="It's a &quot;test&quot;">
    <input type="text" name="name_cat" value="Some attribute">
    <input type="submit" value="save">
</form>

Однако вам придется декодировать этот html-код на серверной части.Это, вероятно, лучшее, что вы могли бы сделать, потому что XML не позволяет «экранировать» кавычки, такие как "\"this\"".Спецификация требует экранирования кавычек, таких как "this".

Answer 3

Вы можете HTML кодировать значения с помощью этой функции:

function htmlEncode(str) {
    var div = document.createElement('div');
    var txt = document.createTextNode(str);
    div.appendChild(txt);
    return div.innerHTML;
}

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

span_name = htmlEncode(tr.find("span.name_cat").html());

Лучшей альтернативой может быть создание входных данных с помощью jQuery и установка значений с помощью метода val (), а затем добавление в форму:

var $form = $('<form action="/admin/controllers/edit_cat.php" method="post" />');
var $id_cat_input = $('<input type="hidden" name="id_cat" />');
$id_cat_input.val(id_cat);
$id_cat_input.appendTo($form);

Answer 4

Я преобразовал user113716 answer в плагин jQuery и немного его очистил.

(function($) {
  $.fn.escapeQuotes = function() {
    return this.html().replace(/"/g, '"');
  }
})(jQuery);

var spanValue = $('span').escapeQuotes();
var formTemplate = [
  '<form action="/admin/controllers/edit_cat.php" method="post" >',
    '<input type="text" name="name_cat" value="' + spanValue + '" />',
    '<input type="submit" value="save" />',
  '</form>'
].join('');

$(formTemplate).appendTo('body');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<span class="name_cat">It&#039;s a &quot;test&quot; </span> (5)

Answer 5

Вы должны преобразовать их в HTML-объекты или пропустить их.Цитата в виде html-сущности выглядит так: «Делайте это с вашим языком программирования. Не с js.