如何让这段代码更具可读性

Question

这是php代码的一部分，它使用contentArray，它是一个JSON，并为用户生成用户界面，它生成html标签，并且它也生成js代码。它的工作原理，但我认为代码很难阅读和维护，任何想法？谢谢。

for($i = 0; $i < count($contentArray); $i++){ 

    if($i %2 == 0){ 
     echo ("<li class='even_row'>"); 
    }else{ 
     echo ("<li class='odd_row'>"); 
    } 
    $content = $contentArray[$i];  

    echo("<textarea class='userdata' id='user_data_textarea_".$content->{'m_sId'}."'>"); 
    echo($content->{'m_sDataContent'}); 
    echo("</textarea>"); 

echo("</li>"); 

    echo("<script type='text/javascript'>"); 

    echo("$('#user_data_textarea_".$content->{'m_sId'}."').bind('keydown', function(e){"); 
    echo(" TypingHandler.handleTypingInUserDataTextArea(".$content->{'m_sId'}.", e);"); 
    echo(" });");  

    echo("</script>"); 

}    

Answer 1

首先为您的奇数和偶数造型没有需要的一类只使用CSS

here is info on that

然后在PHP只能随声附和你所需要的一行

$count = count($contentArray); 
for($i = 0; $i < $count; $i++){ 
    $content = $contentArray[$i];  
    echo('<li><textarea class="userdata" id="user_data_textarea_"'.$content->{'m_sId'}.'">'.$content->{'m_sDataContent'}.'</textarea></li>'); 
} 

并让我们把jquery放在html页面，远离php

我们得到了可以通过使用阵列starts with selector

$('[id^=user_data_textarea_]').bind('keydown', function(e){ 
    var id = this.id.str_replace("user_data_textarea",""); 
    TypingHandler.handleTypingInUserDataTextArea(id, e); 
});  

Answer 2

你的“for”循环的一个提示，你应该在循环之前计算$ contentArray的计数。每次循环执行时，都必须调用该函数。

$count = count($contentArray); 

for ($i=0; $i<count; $i++) { 
// ... 
} 

Answer 3

jQuery代码应该已经在HTML中，使用一些主选择器而不是一个接一个的绑定元素，这对我来说没有意义。这应该澄清你的代码。

for($i = 0; $i < count($contentArray); $i++){ 
    $content = $contentArray[$i];  

    echo "<li class='" . (($i %2 == 0) ? "even_row" : "odd_row") . ">"; 
     echo "<textarea class='userdata' id='user_data_textarea_".$content->{'m_sId'}."'>"; 
     echo $content->{'m_sDataContent'}; 
     echo "</textarea>"; 
    echo "</li>"; 
}  

ADDED

一个通用的案例：

$(function() { 
    $('.userdata').click(function() { 
     some_function($(this).attr('id'); 
    }); 
}) 

也就是说，绑定使用类选择和后期的使用做了一些工作的唯一标识符。

Answer 4

你可以尝试真正的HTML：例如使用smarty

<?php 
for($i = 0; $i < count($contentArray); $i++){ 
    $rowClass = $i %2 == 0 ?'even_row' : 'odd_row'; 
?> 
    <li class='<?= $rowClass ?>'> 
     <textarea class='userdata' id='user_data_textarea_<?=$content->{'m_sId'}?>'> 
     <?= $content->{'m_sDataContent'} ?> 
     </textarea> 
    </li> 
    <script type='text/javascript'> 
    //etc... 
    </script> 
<?php } ?> 

Answer 5

独立的内容和代码。它需要在短期内进行一些基础设施投资，但从长远来看会改善维护。

反思评论，让我们将PHP视为一种真正的模板语言。

$contentCount = count($contentArray); 
for($i = 0; $i < $contentCount; $i++) 
{ 
    $rowType = ($i % 2) ? 'even' : 'odd'; 
    $content = $contentArray[$i]; 
    echo <<<EOT 
<li class='{$rowType}_row'> 
    <textarea class='userdata' id='user_data_textarea_{$content->m_sId}'> 
     {$content->m_sDataContent} 
    </textarea> 

</li> 
<script type="text/javascript"> 
    $('#user_data_textarea_{$content->m_sId}').bind('keydown', function(e) 
    { 
     TypingHandler.handleTypingInUserDataTextArea({$content->m_sId}, e); 
    } 
</script> 
EOT; 
} 

Answer 6

它应该看起来像这样，为了在IDE中更好的可读性。

<?php 
foreach($contentArray as $content){ 
    ?> 
    <li> 
     <textarea class="userdata" id="user_data_textarea<?php echo htmlentities($content['m_sId']); ?>"> 
      <?php echo htmlspecialchars($content['m_sDataContent']); ?> 
     </textarea> 
     <script type="text/javascript"> 
      $('#user_data_textarea_<?php echo htmlspecialchars($content['m_sId']); ?>').bind('keydown',function(e){ 
       TypingHandler.handleTypingInUserDataTextArea('<?php echo htmlspecialchars($content['m_sId']); ?>',e); 
      }); 
     </script> 
    </li> 
<?php 
} 

Answer 7

您可以删除（）从回声陈述，他们不一定需要和可能帮助它看起来有点整洁......

Answer 8

这实际上看起来很理解我;我可以毫不费力地弄清楚你在做什么。唯一的区别，我建议将是该行类使用ternary operators：

echo "<li class='".(($i%2 == 0) ? "even" : "odd")."_row'>"; 

...但是这只是我，有些人会发现，较为混乱，而不是更少。我个人喜欢把它全部放在一行中。

Answer 9

Personnaly，我喜欢用printf在php中编写html代码。它可能看起来像：

for($i = 0; $i < count($contentArray); $i++){ 

    printf("<li class='%s'>", $i % 2 ? "odd_row" : "even_row"); 
    $content = $contentArray[$i];  

    printf("<textarea class='userdata' id='user_data_textarea_%s'>%s</textarea>", 
     $content->{'m_sId'}, 
     $content->{'m_sDataContent'}); 

    echo("</li>"); 

    echo("<script type='text/javascript'>"); 

    printf("$('#user_data_textarea_%1$s').bind('keydown', function(e){ 
     TypingHandler.handleTypingInUserDataTextArea(%1$s, e); 
     });", 
     $content->{'m_sId'});  

    echo("</script>"); 

}  

Answer 10

<?php 
    foreach($contentArray as $content){ 
     $class = ($i %2 == 0) ? "even_row": "odd_row"; ?> 
     <li class="<?php echo $class ?>"> 
      <textarea class='userdata' id='user_data_textarea_<? echo $content['m_sId'] ?>'> 
       <? php echo $content['m_sDataContent'] ?> 
      </textarea> 
     </li> 
     <script type='text/javascript'> 
      $('#user_data_textarea_<?php echo content['m_sId'] ?>').bind('keydown', function(e){ 
       TypingHandler.handleTypingInUserDataTextArea(<?php $content['m_sId'] ?>, e); 
      }); 
     </script> 
<?php } // end foreach ?> 

Answer 11

把一切都得到了每一个项目，然后在你的循环结束呼应他们。

// Put each item in the array, then echo at the end 
$items = array(); 
$js = array(); 

// I'm assuming that your content array has numeric keys 
// if not, use the for statement from your original code 
foreach ($contentArray as $i => $content) 
{ 
    // using sprintf 
    $items[] = sprintf('<li class="%s_row"><textarea class="userdata" id="user_data_textarea_%s">%s</textarea></li>' 
     , ($i % 2) ? 'even' : 'odd' 
     , $content->m_sId 
     , $content->m_sDataContent 
    ); 

    // or just plain old concatenation 
    $js[] = "$('#user_data_textarea_{$content->m_sId}').bind('keydown', function(e){TypingHandler.handleTypingInUserDataTextArea({$content->m_sId}, e);});"; 
} 

echo "<ul>" . join("\n", $items) . "</ul>\n" 
    . '<script type="text/javascript">' . join("\n", $js) . "</script>\n";