将整个字符串存储为数据属性时出现问题

Trouble storing entire string as data attribute

本文关键字：问题 数据属性 字符串 存储      更新时间：2023-09-26

我目前正在尝试从HTML数据属性传递数据，如下所示：

// From
$(".search-results").append('<div data-id=' + movie.id + ' data-title=' + movie.title + ...'
//To
$('#movie-info').append('<h5>' + ($(this).data("title")) + '</h5>');

麻烦的是只传递了电影字符串中的第一个单词。不太清楚为什么。

当属性可以包含空格时，您需要属性的分隔符：

$(".search-results").append(
   '<div data-id="' + movie.id + '" data-title="' + movie.title + '"...'

您还应该考虑它是否需要HTML编码，即它是否可以包含"，<，>或&等字符。

避免创建 HTML 代码问题的一种简单方法是创建元素：

var div = $('<div>').data({ id: movie.id, title: movie.title });
$(".search-results").append(div);

当您使用该值时，同样有效，以避免标题被解释为 HTML：

var header = $('<h5>').text($(this).data("title"));
$('#movie-info').append(header);

属性的值应括在引号中。它应该看起来像这样：

// From
$(".search-results").append('<div data-id="' + movie.id + '" data-title="' + movie.title + '"...');
//To
$('#movie-info').append('<h5>' + ($(this).data("title")) + '</h5>');
相关文章：