jquery 更改 div 文本

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/1103172/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-26 10:40:41  来源:igfitidea点击:

jquery change div text

jquery

提问by gubby

'<div id="'+div_id+'" class="widget" style="height:60px;width:110px">\n\
            <div class="widget-head ui-widget-header" style="cursor:move;height:20px;width:130px">'+
         '<span id="'+span_id+'" style="float:right; cursor:pointer" class="dialog_link ui-icon ui-icon-newwin ui-icon-pencil"></span>'  +
          dialog_title+'</div></div>

I have a div constructed using the above string. After some processing..I have to change the dialog_title in the above div. I am trying to do it with the following code

我有一个使用上述字符串构造的 div。经过一些处理..我必须更改上面div中的dialog_title。我正在尝试使用以下代码

$('#'+div_id+' .widget-head').text("new dialog title");

While this changes the dialog title..it removes the span element which is used to open a dialog box.

虽然这会更改对话框标题..它删除了用于打开对话框的 span 元素。

I tried to the replaceWith method with a string with new dialog title..but that shows NaN for title and the span though visible cant be clicked(are events disabled?)

我尝试使用带有新对话框标题的字符串的 replaceWith 方法..但是显示标题为 NaN 和跨度虽然无法单击可见(是否禁用了事件?)

How do I change the text without losing the span and ability to click it.

如何在不丢失跨度和单击它的能力的情况下更改文本。

Thanks in advance.

提前致谢。

回答by gubby

Put the title in its own span.

将标题放在自己的范围内。

<span id="dialog_title_span">'+dialog_title+'</span>
$('#dialog_title_span').text("new dialog title");

回答by Martin Thurau

I think this will do:

我认为这会做:

$('#'+div_id+' .widget-head > span').text("new dialog title");

回答by TheVillageIdiot

best and simple way is to put title inside a span and replace then.

最好和最简单的方法是将标题放在一个跨度内然后替换。

'<div id="'+div_id+'" class="widget" style="height:60px;width:110px">\n\
        <div class="widget-head ui-widget-header" 
                style="cursor:move;height:20px;width:130px">'+
     '<span id="'+span_id+'" style="float:right; cursor:pointer" 
            class="dialog_link ui-icon ui-icon-newwin ui-icon-pencil"></span>' +
      '<span id="spTitle">'+
      dialog_title+ '</span>'
 '</div></div>

now you can simply use this:

现在你可以简单地使用这个:

$('#'+div_id+' .widget-head sp#spTitle').text("new dialog title");