油猴脚本按钮点击事件添加与优化：自动生成图像

本文将介绍如何在油猴脚本中为添加的按钮添加点击事件监听器，并以自动生成图像为例，展示如何实现相应功能。

添加按钮点击事件监听器

在 addButtons 函数中，需要为创建的 txt2img 和 img2img 按钮添加点击事件监听器，以执行相应的操作。以下代码展示了添加事件监听器的示例：

// Add event listeners to the txt2img and img2img buttons
txtToImgButton.addEventListener('click', function() {
    promptTextarea.value = '[img]' + promptTextarea.value.trim().replace(/\n/g, '[/img]\n[img]') + '[/img]';
    generateButton.click();
});

imgToImgButton.addEventListener('click', function() {
    promptTextarea.value = promptTextarea.value.trim().replace(/\n/g, '\n\n');
    generateButton.click();
});

优化旧脚本

本文给出的新脚本代码相比旧的脚本，有以下优化和重构：

代码结构更清晰：新脚本代码将按钮创建、事件监听等逻辑分别封装在不同的函数中，结构更加清晰，易于理解和维护。
代码更简洁：新脚本代码通过使用 addEventListener 方法，简化了按钮点击事件的处理逻辑，代码更加简洁。
代码更具可读性：新脚本代码使用了更具描述性的变量名，并添加了注释，提高了代码的可读性。

总结

本文介绍了如何在油猴脚本中为按钮添加点击事件监听器，并以自动生成图像为例，展示了如何实现相应功能。此外，本文还对旧的脚本代码进行了优化和重构，使其更易于理解和维护。

旧脚本代码

    function clicktxt2img(){

     var b1skip=gradioApp().querySelector('#txt2img_skip');
     if (isHide(b1skip)){
        console.log(lines[i]);
        if(lines[i] != ""){
          var txt2img_textarea = gradioApp().querySelector("#txt2img_prompt > label > textarea");
          txt2img_textarea.focus();
          txt2img_textarea.value=lines[i];

          txt2img_textarea.dispatchEvent(new Event('input', { bubbles: true }));

          var b1=gradioApp().querySelector('#txt2img_generate');
          b1.click();
        }
        i+=1;

        console.log("finish" + i);
     }

     if(i>=lines.length){
        toggleButton1.disabled=false;
        clearInterval(tida);
     }

 }


   function clickimg2img(){

     var b2skip=gradioApp().querySelector('#img2img_skip');
     if (isHide(b2skip)){
        console.log(lines[i]);
        if(lines[i] != ""){
          var img2img_textarea = gradioApp().querySelector("#img2img_prompt > label > textarea");
          img2img_textarea.focus();
          img2img_textarea.value=lines[i];

          img2img_textarea.dispatchEvent(new Event('input', { bubbles: true }));

          var b2=gradioApp().querySelector('#img2img_generate');
          b2.click();
        }
        i+=1;

        console.log("finish" + i);
     }

     if(i>=lines.length){
        toggleButton2.disabled=false;
        clearInterval(tidb);
     }

 }