jQuery .append()搞砸了定位

时间:2017-10-21 02:41:24

标签: javascript jquery html css jquery-ui

我正在尝试创建一个网页,用户可以在其中添加对象并使用jQuery-UI拖动它们。用于添加对象(可以是图像或文本)的代码可以这样汇总:

struct DynamicInterface
{
    virtual ~DynamicInterface() = default;
    virtual size_t size() const = 0;
    virtual TypeCode type() const = 0;   

    // I wish I could do this , but template member functions cannot be virtual
    // due to compile time vs runtime requirements for templates vs virtual methods.
    // virtual template<typename T> std::vector<T>::iterator begin() = 0; 
    // virtual template<typename T> std::vector<T>::iterator end() = 0;
};

template<typename T>
class DynamicVector : public DynamicInterface
{
public:
    ~DynamicVector<T>() override = default;
    DynamicVector<T>(const std::vector<T>& vec, const TypeCode type) : vec_(vec), type_(type) {}
    size_t size() const override { return vec_.size(); }
    TypeCode type() const override { return type_; }
    T& operator[](size_t n) { return vec_[n]; }

    typename std::vector<T>::iterator begin() {return vec_.begin(); }
    typename std::vector<T>::iterator end() {return vec_.end(); }

    private:
        std::vector<T> vec_;
        TypeCode type_;
};

当我创建第一个对象时,我没有问题。但是,每个后续对象使用前一个对象的结尾作为它的(0; 0)坐标,如下所示:

function createObject($inner) {
    var $newObject = $("<div></div>").append($inner)
    .attr(/* some attributes */)
    .css(/* some css (which makes the position relative) */)
    .appendTo($father);
}

对象B的坐标现在为(0; 0),即使它显然不在左上角。有人知道为什么会这样吗?

1 个答案:

答案 0 :(得分:0)

你必须使用CSS position属性为绝对

https://www.w3schools.com/cssref/pr_class_position.asp

position:absolute;

此外,您必须确保您所指的$ father始终相同。

这可以通过创建一个位置为absolute的div / container块并将所有新添加的元素添加到该blok中来完成。