Javascript 表触发后防止断线

我希望表格提供的编辑字段与触发它的文本保持在同一行。我创建了一个JSFIDLE来说明我的意思

如您所见，编辑字段始终位于下一行。。。我尝试了“空白：nowrap；”和“显示：内联”；但所有这些似乎都被表忽略了。 我的javascript看起来像这样

$(document).ready(function () {
    $(".display-date").editable('www.example.com', {
        type: 'select',
        data: "{'Belgrade':'Belgrade','Paris':'Paris','London':'London', 'selected':'Belgrade'}",
        cancel: 'cancel',
        submit: 'ok',
    });
});


$(".edit-trigger").click(function () {
    $(this).prev().trigger(".display-date");
});

html是

<p style="font-size:10pt; white-space: nowrap;display: inline;">Next meeting:
    <div class="display-date select_next_jc" style="font-size:10pt; white-space: nowrap;display: inline;">test-time <a class="edit-trigger">Edit</a>

    </div>
</p>

下次会议： 测试时间编辑

谢谢

---

卡尔

在表格选项中使用

样式：“继承”

：

$(document).ready(function () {
    $(".display-date").editable('www.example.com', {
        type: 'select',
        data: "{'Belgrade':'Belgrade','Paris':'Paris','London':'London', 'selected':'Belgrade'}",
        cancel: 'cancel',
        submit: 'ok',
        style: 'inherit'
    });
});

JSFiddle：

这将导致新创建的表单继承与您在可编辑元素上设置的样式相同的样式（包括

display:inline

）

资料来源：