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
    });
});