HTML / Javascript从数据附加多个单词

Question

我正在尝试将按钮上的文本附加到模式窗口。

到目前为止，它仍然有效，但是如果数据包含两个以上的单词，它将仅打印第一个单词，我在做什么错？

...
<button type="submit" class="observeSubmit deleteProject" data-title={{ $productValue->title }} name="removeProj">
...

js功能：

$('button[name="removeProj"]').on('click', function(e){
    var $form = $(this).closest('form'); // closest parent form
    e.preventDefault();

    $("#prodTitle").empty().append($(this).data('title') || '-');

    $('#confirm').modal({ backdrop: 'static', keyboard: false })
    $('#delete').click(function() {
        $form.trigger('submit'); // submit the form
    });
});

因此，如果我单击按钮，则会打开一个模式并显示$productValue->title内的值。

例如，如果$productValue->title成立，则为Jon Doe。

窗口仅显示Jon。

我不确定这是否归因于data属性，也许它只能容纳一个值，还是归因于javascript函数。

Answer 1

您需要将自定义属性包装在引号中。

<button data-title="{{ $productValue->title }}"></button>

Answer 2

<button type="submit" class="observeSubmit deleteProject" data-title="{{ $productValue->title }}" name="removeProj">

现在，它为数据标题分配值“ Jon”，并将Doe视为单独的属性。

Answer 3

在这里工作正常https://jsfiddle.net/

<form action="">
<button type="submit" class="observeSubmit deleteProject" data-title="test sdfg" name="removeProj">btntest</button>
</form>
<div id="prodTitle"></div>
$('button[name="removeProj"]').on('click', function(e){
    var form = $(this).closest('form'); // closest parent form
    debugger
    e.preventDefault();

    $("#prodTitle").empty().append($(this).data('title') || '-');

    $('#confirm').modal({ backdrop: 'static', keyboard: false })
    $('#delete').click(function() {
        $form.trigger('submit'); // submit the form
    });
});