Question

我遇到了jquery点击事件的问题。一些背景：我想实现简单的调度程序。我有一张桌子（我的时间表）。当我点击td时，我想添加一个div元素（在时间表中安排的项目。它的位置：绝对，可以大于td！）。当我点击这个div时，它应该被删除。如果td包含div，我应该能够添加另一个（它们可以叠加）。问题是当我尝试删除现有div时。在td元素上调用一个事件而不是我点击的div。我检查了事件的目标，它显示它是在div元素上触发的，所以现在我很困惑......请帮忙。 修改：
进一步的问题解释：
我点击一个div 2.调用“// td on click” 3。“//删除div”被调用
4。“//添加新div”被调用
我只想要调用“// remove div”。

修改
https://jsfiddle.net/rmwfj8Lk/

代码：

public function search_people($s_id,$limit_start,$limit_end)
{

    $this->db->from('search_result');
    if($s_id){
        $this->db->where("FIND_IN_SET('$s_id[0]', skills) != ", 0);
        for($x=1; $x < count($s_id); $x++) {
            $this->db->or_where("FIND_IN_SET('$s_id[$x]', skills) != ", 0);
        } 
    }

    $this->db->limit($limit_start, $limit_end);
    $query = $this->db->get();
    return $query->result_array();
}


public function count_users($s_id=null)
{

    if($s_id){
        $this->db->where("FIND_IN_SET('$s_id[0]', skills) != ", 0);
        for($x=1; $x < count($s_id); $x++) {
            $this->db->or_where("FIND_IN_SET('$s_id[$x]', skills) != ", 0);
        } 
    }
    $query = $this->db->get();
    return $query->num_rows();
}

的CSS：

var clickedtd = null;

// add new div
$("#testbutton").click(function () {
    var clientName = $('#clientName').val();
    var eventLength = $('#timeSelect').find(":selected").val();
    var eventPadding = parseInt(clickedtd.css('padding')) * 2;
    var eventHeight = parseInt(clickedtd.css('height'));
    var extraHeight = Math.floor(eventLength) - Math.floor(eventLength - 0.1);
    var eventHeight = eventHeight * eventLength - eventPadding - extraHeight;
    var margin = parseInt(clickedtd.css('height')) / 2 - 1;

    $('<div />', {
        'text': clientName,
        'class': 'floating-event',
        'style': 'height:' + eventHeight + 'px; padding: 2px 0px 0px 2px; margin-top:' + margin + 'px;'
    }).appendTo(clickedtd);
})

// remove div
$("html").on({
    click: function (e) {
        $(this).remove();
    }
}, ".floating-event"
);

// td on click
//$("td.visit-cell").on("click", this, function (e) {
//$("td.visit-cell").click(function(e){
$("table").delegate("td", "click", function(e){
    // this shows that div is clicked but event is for td?!?
    console.log("event on:" + e.target)
    clickedtd = $(this);

    // open modal window and set item properties
    $("#modalTrigger").click();

});

jQuery省略了绝对元素

0 个答案: