Question

我不得不重复自己来启用＆＃34;输入＆＃34;关键功能，但它的工作原理。我正在考虑禁用它，但考虑到用户体验我想启用它。目前正在开发一个由JQuery和JQuery UI驱动的简单待办事项列表应用程序。以下是代码摘录。

var $inputButtonHolder = $('.input-button-holder')
var $userListContainer = $('.user-items-container');//Grab main container which is hard coded
var $sortDivContainer = $('<div class="sorter-container"></div>');
//Event handler attached to button element
$('#add-button').on('click', function(){
    var $userInput = $('#add-to-do').val();//Get User Input
    function addUserItem(){
        var $spanElem = $('<span class="user-input">').append($userInput);//Dynamically generating a span element
        var $listOptions = $('<a href="#" class="delete-list">Delete</a>');//Dynamically generating a tag element
        //Div element to hold child elements span and a tag - also dynamically generated
        var $newDivElem = $('<div>',{
            "class": 'user-item',
        }).append($spanElem);
        //Checkboxes also dynamically generated and appended to newDivElem
        var $checkBoxes = $('<input>', { type: 'checkbox', id: 'cb'}).appendTo($newDivElem);
        $listOptions.appendTo($newDivElem);//append delete option to user list item
        $userListContainer.append($sortDivContainer);//Append user item div which will enable sorting using JQ UI
        $sortDivContainer.append($newDivElem); //Here we append user input
        $('#add-to-do').val('');
        $('.warning-message').hide();   
    };
    //pu
    if($userInput==''){
        $('.warning-message').fadeIn();
    }else {
        addUserItem();
    };
});
//when user presses the enter key after input
$('#add-to-do').on('keypress', function(e){
    if(e.which == 13) {
        var $userInput = $('#add-to-do').val();//Get User Input
        function addUserItem(){
            var $spanElem = $('<span class="user-input">').append($userInput);//Dynamically generating a span element
            var $listOptions = $('<a href="#" class="delete-list">Delete</a>');//Dynamically generating a tag element
            //Div element to hold child elements span and a tag - also dynamically generated
            var $newDivElem = $('<div>',{
                "class": 'user-item',
            }).append($spanElem);
            //Checkboxes also dynamically generated and appended to newDivElem
            var $checkBoxes = $('<input>', { type: 'checkbox', id: 'cb'}).appendTo($newDivElem);
            $listOptions.appendTo($newDivElem);//append delete option to user list item
            $userListContainer.append($sortDivContainer);//Append user item div which will enable sorting using JQ UI
            $sortDivContainer.append($newDivElem); //Here we append user input
            $('#add-to-do').val('');
            $('.warning-message').hide();   
        };
        if($userInput==''){
            $('.warning-message').fadeIn();
        }else {
            addUserItem();
        };
        e.preventDefault();
    }
});

Answer 1

第一步是提取内部函数，然后重用它。

Sub testFunc()

    MsgBox addZero("54126-3")

End Sub

Answer 2

你有两次addUserItem（）函数。你可以把它变成一个公众＆＃39;功能，然后只需调用它。无需将所有代码输入两次。

如何改进或重写此代码并使其高效？

2 个答案: