Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/384.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181

Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/html/80.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
javascript中的便签_Javascript_Html_Css - Fatal编程技术网

javascript中的便签

javascript中的便签,javascript,html,css,Javascript,Html,Css,我正在用javascript为学校项目做一些便签。我已经制作了一个按钮,可以添加注释,它们现在只是div,没有任何文本。我可以通过按每个音符上的红色div来删除它们。还有一个计数器,用于计算屏幕上的实际注释数,另一个计数器用于计算自第一个计数器以来的所有注释数。我还要做另外三件事,分别是: 移动鼠标时按住绿色div键更改每个音符的大小。 通过按黄色div打开Tinymce编辑器。好吧,opener可以工作,但我需要关闭它,通过按红色div和绿色div,我需要将书面文本保存在note中,note打

我正在用javascript为学校项目做一些便签。我已经制作了一个按钮,可以添加注释,它们现在只是div,没有任何文本。我可以通过按每个音符上的红色div来删除它们。还有一个计数器,用于计算屏幕上的实际注释数,另一个计数器用于计算自第一个计数器以来的所有注释数。我还要做另外三件事,分别是:

移动鼠标时按住绿色div键更改每个音符的大小。 通过按黄色div打开Tinymce编辑器。好吧,opener可以工作,但我需要关闭它,通过按红色div和绿色div,我需要将书面文本保存在note中,note打开了编辑器。 选择多个便笺,如桌面上Windows中的某些文件,然后将其移动。移动一组音符。 我希望有人能帮我。/我真的需要这个

我当前的代码:

var cnt = 0;
var x = 0;
var y = 0;
var xx = 0;
var yy = 0;
var counter = 0;
var ilosc = 0;
var dragging = false;
var klikd = false;

document.addEventListener("onload",Load());

function Load(){
    tinyMCE.init({
        mode : "textareas",
        theme : "modern"
    });
}

function adder(){
    //alert("thall");

    var paper = document.createElement("div");
    var paperS = document.createElement("div");
    var paperX = document.createElement("div");
    var paperW = document.createElement("div");
    paper.setAttribute("id","kartka"+counter);
    paper.setAttribute("onmousedown","itsyourmoove(this,event)");
    paper.setAttribute("onmouseup","nara(this)");
    paper.setAttribute("onmouseleave","elo(this)");
    paperX.setAttribute("id","deleter");
    paperX.setAttribute("onclick","killmepls("+counter+")");
    paperS.setAttribute("id","size");
    paperS.setAttribute("onmousedown","sizechanger(this,event)");
    paperW.setAttribute("id","write");
    paperW.setAttribute("onclick","writeTxt("+counter+")");
    paper.setAttribute("class","kartka");
    paper.appendChild(paperX);
    paper.appendChild(paperS);
    paper.appendChild(paperW);
    document.body.appendChild(paper);
    counter++;
    ilosc++;

    document.getElementById("counter").innerHTML = "Przebieg = " + counter + "<br>" + "Ilosc kartek na tablicy: " + ilosc;
}


function itsyourmoove(e,event)
{
    cnt++;
    e.style.zIndex = cnt; //The z-index property specifies the stack order of an element.
    x = event.clientX;
    y  = event.clientY;
    xx = e.style.left;
    yy = e.style.top;
    xx = xx.slice(0,xx.search("px"));
    yy = yy.slice(0,yy.search("px"));
    x = x - xx;
    y = y - yy;

    e.setAttribute("onmousemove","move(this,event)");

}

function writeTxt(){
    //alert("meme");
    var tiny = document.getElementById("editor");
    tiny.style.visibility = "visible";
    var tindiv = document.getElementById("tiny");
    tindiv.style.visibility = "visible";

}

function killmepls(e){
    //e.parentElement.id="USUNTO";
    //var iks = document.getElementById("USUNTO");
    //iks.parentNode.removeChild(iks);
    document.body.removeChild(document.getElementById("kartka"+e));
    ilosc--;
    document.getElementById("counter").innerHTML = "Przebieg = " + counter + "<br>" + "Ilosc kartek na tablicy: " + ilosc;


}

function move(e,event){
    e.style.top = event.clientY - y + "px";
    e.style.left = event.clientX - x + "px";
}

function elo(e){
    e.setAttribute("onmousemove","nothing()");
}

function nara(e){
    e.setAttribute("onmousemove","nothing()");
}
function nothing(){
    console.log("nice meme");
    //alert("you've got memed");
}

function sizechanger(e, event){

    e.setAttribute("onmousedown","changeWidthHeight(this,event)");
    klikd = true;
}

function changeWidthHeight(e,event){
    if(klikd = true){
    p = e.parentElement;
    event.clientY = y;
    event.clientX = x;
    p.style.width = (e.clientX - parseInt(getComputedStyle(p).left)) + "px";
    p.style.height = (e.clientX - parseInt(getComputedStyle(p).top)) + "px";
    }else{
        nothing();
        }
}
var close = document.getElementById("exit");

    close.onmousedown = function () {
        var tiny = document.getElementById("ed");
        tiny.style.visibility = "hidden";
        var tindiv = document.getElementById("tiny");
        tindiv.style.visibility = "hidden";
        var my_editor_id = 'content';
        tinymce.get(my_editor_id).setContent(' '); 
    }

你真的希望我们从一个看起来不确定的网站下载一个随机的zip文件吗?请创建一个或使用默认代码段功能。好的,但我使用的是额外的hm库,它是Tinymce,我不能将它添加到JSFIDLE:/btw中,您所说的这类操作听起来像拖放行为,这并不容易。您没有在纯JavaScript中进行拖放操作,是吗?因为那是在浪费时间。你应该使用图书馆。当然你可以使用TimyMCE。只需包括脚本和设置演示。这是一个开始的演示:如果你想使用一个库,那么这就是你想要的,