用输入替换标题并更新数据库上的标题

时间:2013-10-09 14:43:09

标签: javascript php jquery html

您好我正在尝试通过文本输入点击它来替换标题以修改标题然后将修改提交到数据库,我正在使用此代码:

<div style="font-size: 70%;"><h2 class="outer"><?php echo $designation; ?> </h2></div>

这个div使用另一个脚本加载,因此不在原始页面上,所以我认为我们必须使用委托方法。

这是我用来将其背景颜色变为粉红色的jquery脚本:

<script src="jquery-1.10.2.min.js">
  $(document).ready(function(){
     $("#right").delegate("h2","click",function(){
       $("h2").css("background-color","pink");
     });
  });
 </script>

知道如何用文本输入标签替换此div中的标题吗?在输入字段外单击后,如何将修改提交到数据库? 谢谢

1 个答案:

答案 0 :(得分:1)

  • 您的代码中没有点击处理程序,您可以使用.on()方法
  • 您应该使用另一个脚本标记来加载.js文件,您的标记无效
  • input元素没有结束标记,您应该删除</input>

    <script src="jquery-1.10.2.min.js"></script>
    
    <script>
       $(document).ready(function(){ // When the DOM is ready
          $(".outer").on('click', function() {
             if ( this.children.length ) return;
             var text = $.trim(this.innerHTML);
             $("<input>").val(text)
                         .appendTo($(this).empty())
                         .focus();
          }).on('blur', 'input', function() {
             // Listening to blur event 
             // for replacing the element with it's value
             $(this).replaceWith( $.trim(this.value) );
          })
       })
    </script>
    

http://jsfiddle.net/3FKzH/