help me to reduce the amount of code in a jquery script
Currently I'm using this jquery script combining with php (doesn't matter):
<script type="text/javascript" charset="utf-8">
$(document).ready(function(){
var select = "<?php if_exist($select, ''); ?>";
var event = "<?php if_exist($event, 'click'); ?>";
var display = "<?php if_exist($display, '#display'); ?>";
var loading = "<?php if_exist($loading, '#loading'); ?>";
var datatype = "<?php if_exist($datatype, 'json'); ?>";
var cache;
if (event == "submit"){ $("input:submit").hide(); }
$(select).bind( event , function(key){
if ( event == "keypress" ) {
if ( key.which == <?php if_exist($keycode, '13'); ?> ) {
$(loading).show();
$.post(
$(select).attr("action"),
$(select).serialize(),
function(data){
if (datatype == "html" || datatype == "text"){ var returned = data; }
if (datatype == "json"){ var returned = data<?php if_exist($return, '.return'); ?>; }
if (returned != cache)
{
cache = returned;
if (datatype == "html" || datatype == "text"){ $(display).hide().html(data).fadeIn(); }
if (datatype == "json"){ $(display).hide().autoRender(data).fadeIn(); }
$(loading).hide();
}
},
datatype
);
return false;
};
}
else
{
$.post(
$(select).attr("action"),
$(select).serialize(),
function(data){
if (datatype == "html" || datatype == "text"){ var returned = data; }
if (datatype == "json"){ var returned = data<?php if_exist($return, '.returnValue'); ?>; }
if (returned != cache)
开发者_运维知识库 {
cache = returned;
if (datatype == "html" || datatype == "text"){ $(display).hide().html(data).fadeIn(); }
if (datatype == "json"){ $(display).hide().autoRender(data).fadeIn(); }
$(loading).hide();
}
},
datatype
);
if ($event == 'submit') { return false;}
}
});
});
</script>
I want to reduce the amount of code used in this script, I think we can surely reduce the amount of code in this script by giving our attention to the line #11 which contains: if ( event == "keypress" ) {
, because in the next else
statement the same code is repeated twice, but how can we do this? Any idea?
The following piece looks duplicated:
$.post(
$(select).attr("action"),
$(select).serialize(),
function(data){
if (datatype == "html" || datatype == "text"){ var returned = data; }
if (datatype == "json"){ var returned = data; }
if (returned != cache)
{
cache = returned;
if (datatype == "html" || datatype == "text"){ $(display).hide().html(data).fadeIn(); }
if (datatype == "json"){ $(display).hide().autoRender(data).fadeIn(); }
$(loading).hide();
}
},
datatype
);
You should consider moving it's functionality to a function (sic)!
In addition to Vlad's answer: Remove the unnecessary if query and variable assignment:
$.post(
$(select).attr("action"),
$(select).serialize(),
function(data) {
// in every case, data is assigned to another variable which is
// unnecessary as well
// if (datatype == "html" || datatype == "text"){ var returned = data; }
// if (datatype == "json"){ var returned = data; }
if (data != cache) {
cache = data;
}
if (datatype == "html" || datatype == "text") {
$(display).hide().html(data).fadeIn();
}
else if (datatype == "json"){
$(display).hide().autoRender(data).fadeIn();
}
$(loading).hide();
}
}, datatype );
精彩评论