“样式”代码在 MVC 模式中的位置

Where does "styling" code go in the MVC pattern?

本文关键字:模式 位置 MVC 样式 代码      更新时间:2023-09-26

B2:

请不要使用下面的代码片段,该代码段将样式设置为根据用户操作而更改 ->即模糊,焦点,按键。

它是独立的...只需给它一个元素 ID 数组,它就会设置样式以在某些事件上更改。

我应该将其放置在模型、视图或控制器中的哪个模块?

function styleTwitter1( pair_array )
{
    var i;
    var input;
    var label;
    for ( i = 0; i < pair_array.length; i+=2 ) 
    {
        input = document.getElementById( pair_array[ i ] );
        label = document.getElementById( pair_array[ i + 1 ] );
        label.style.fontSize = window.getComputedStyle( label, null ).getPropertyValue("font-size");
        closureBuster( input, label );
    }
    function closureBuster( input, label )
    {
        input.addEventListener( "keypress", function()
        { 
            label.style.opacity = 0; 
        }, false );
        input.addEventListener( "focus", function()
        { 
            if( input.value === '' )
            {
                label.style.opacity = 0.2; 
                input.style.border = '1px solid #888888'; 
            }
        } , false );
        input.addEventListener( "blur", function()
        {
            if( input.value === '' )
            {
                label.style.opacity = 1;
                new EffectsFont( label ).fade( 'up', 150 );
                input.style.border = '1px solid #dddddd'; 
            }   
        } , false );
    }
}

在 MVC 中,视图

观察状态并生成输出给用户

因此,用户看到的所有内容(渲染、样式设置等(和与之交互的内容都应该转到视图。

视图向用户显示所有输出,因此与可见性相关的任何内容都将在视图中处理。因此,为了获得最佳性能和结果,您应该按照以下步骤操作

将 java 脚本函数放在单独的 js 文件中 在每个页面(块中(的顶部编写一个 $(document(.ready(( 函数,您要在其中调用所需的函数并将元素数组作为参数传递

这样,您的代码将整洁干净,可重用和可读