Question

我有一组with input_strings ( str ) as ( select 'sdss abc@gmail.com sdsda sdsds ' from dual union all select 'pele@1-futbol.br may not work' from dual union all select 'sql@oracle.com, sam@att.net,solo@violin.com' from dual union all select '' from dual union all select 'this string contains no email addresses' from dual union all select '-this:email@address.illegal_domain' from dual union all select 'alpha@123.34.23.1 talk@radio@mike.com' from dual ) select str as original_string, level as idx, regexp_substr(str, '[[:alnum:]_-]+@[[:alnum:]_-]+\.[[:alnum:]_-]+', 1, level) as email_address from input_strings connect by regexp_substr(str, '[[:alnum:]_-]+@[[:alnum:]_-]+\.[[:alnum:]_-]+', 1, level) is not null and prior str = str and prior sys_guid() is not null ; ORIGINAL_STRING IDX EMAIL_ADDRESS ------------------------------------------- ---------- -------------------------------- -this:email@address.illegal_domain 1 email@address.illegal_domain alpha@123.34.23.1 talk@radio@mike.com 1 alpha@123.34 alpha@123.34.23.1 talk@radio@mike.com 2 radio@mike.com pele@1-futbol.br may not work 1 pele@1-futbol.br sdss abc@gmail.com sdsda sdsds 1 abc@gmail.com sql@oracle.com, sam@att.net,solo@violin.com 1 sql@oracle.com sql@oracle.com, sam@att.net,solo@violin.com 2 sam@att.net sql@oracle.com, sam@att.net,solo@violin.com 3 solo@violin.com this string contains no email addresses 1 1 10 rows selected.类的html代码，我显示nitssection事件onclick的按钮，我是它下面有一些文字，我试图将其设为JQuery contenteditable个事件，但我认为onclick点击事件并非如此。我可以看到nitssection事件正在发挥作用，点击后我可以看到我的按钮。例如，我的HTML代码如下所示：

.nitssection

用于显示按钮I＆＃39; ve：

<div class="section nitssection" data-nitsid="3">
    <div class="container">
        <div class="row">
            <div class="col-sm-4">
                <div class="box-content">
                    <h4 class="box-title nitstext"><a href="text.html">Some text</a></h4>
                    <p class="nitstext">Paragraph</p>
                    <a href="text.html" class="btn btn-sm style4 hover-blue">Read more</a>
                </div>
            </div>
        </div> 
    </div>
</div>

为了让$('.nitssection').click(function(e) { $('#' + nitsid).css({ //Displaying buttons }).fadeIn(400); $(this).click(function(e){ e.stopPropagation(); }) });课程成为可疑的，我是这样的：

nitstext

我无法实现这一目标。帮助我。

Answer 1

元素存在后，contenteditable是一个属性（但无论如何你的attr都应该有效，任何值在技术上都会使布尔属性为真）。

我认为它可以编辑，但它并不明显，因为它似乎没有得到关注;在将其编辑为可编辑后添加对.focus的调用似乎可以使其工作。此外，您还有fucntion而非function，这会阻止部分代码运行。

所以我要进行prop更改并添加.focus并修正拼写错误：

$('.nitstext').click(function () {
   $(this).prop("contenteditable", true).focus();
   //      ^^^^                    ^^^^ ^^^^^^^^
});

...似乎有效（我使用nitsid变量注释了代码，因为我没有＃）：

＆＃13;

$('.nitssection').click(function(e) {
  /*
    $('#' + nitsid).css({
        //Displaying buttons
    }).fadeIn(400);
  */
    $(this).click(function(e){
        e.stopPropagation();
    });
});

$('.nitssection').find('a').each(function () {
     $(this).removeAttr("href");
});
$('.nitstext').click(function () {
   $(this).prop("contenteditable", true).focus();
});

＆＃13;

<div class="section nitssection" data-nitsid="3">
    <div class="container">
        <div class="row">
            <div class="col-sm-4">
                <div class="box-content">
                    <h4 class="box-title nitstext"><a href="text.html">Some text</a></h4>
                    <p class="nitstext">Paragraph</p>
                    <a href="text.html" class="btn btn-sm style4 hover-blue">Read more</a>
                </div>
            </div>
        </div> 
    </div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

＆＃13;

旁注：此代码非常可疑：

$('.nitssection').click(function(e) {
    $('#' + nitsid).css({
        //Displaying buttons
    }).fadeIn(400);
    $(this).click(function(e){
        e.stopPropagation();
    })
});

它在所有.nitsection元素上设置点击处理程序，并在点击它们时，在该特定.nitsection上添加另一个点击处理程序元件。每次点击都会添加一个。这并没有任何意义。

您已经说过这是为了阻止点击.nitstext来解雇.nitssection处理程序;而不是这样做，在.nitstext处理程序中执行此操作：

$('.nitstext').click(function (e) {
   // -------------------------^
   $(this).prop("contenteditable", true).focus();
   e.stopPropagation(); // <===
});

Answer 2

工作示例：https://jsfiddle.net/q8yax2t5/4/

HTML：

<div class="section nitssection" data-nitsid="3">
    <div class="container">
        <div class="row">
            <div class="col-sm-4">
                <div class="box-content">
                    <h4 class="box-title nitstext"><a href="text.html">Some text</a></h4>
                    <p class="nitstext">Paragraph</p>
                    <a href="text.html" class="btn btn-sm style4 hover-blue">Read more</a>
                </div>
            </div>
        </div> 
    </div>
</div>

JS：

$('.nitssection').find('a').each(function () {
    $(this).removeAttr("href");
});

$(document).on('click', '.nitstext', function() {
  this.contentEditable = true;
  $(this).focus();
});

如何使用JQuery使子元素成为可信的

2 个答案: