Question

我目前正在使用 this 插件将图片作为附件发送到电子邮件以及其他一些json数据，我得到了正确的结果。但只是没有从IE7和IE8，它根本不发送..我不知道为什么..

建议任何人？

这是 jsFiddle 。

然后是javascript：

var g_counter = 1;
var dependant = ["dependant"];
var group;
var upload_input_passport = ["upload-passport-1"];
var upload_input_id = ["upload-id-1"];
var surname_input_groups = ["surname-group-1"];
var input_groups = ["group-1"];
var name_fields=[0];
var id_upload_input = "<input class='id_up'   name='myfile[]' type='file'  />";
var passport_upload_input = "<input class='passport_up'   name='myfile[]' type='file' />";
var surname_input = "<input id='surname' class='surname' name='surname' type='text' data-error='Surname error' />";
//Dependants Inputs
jQuery(document).ready(function(e) {
    jQuery(name_fields).each(function() {
        jQuery(id_upload_input).appendTo('#upload-id-1');
    });
    jQuery(name_fields).each(function() {
        jQuery(passport_upload_input).appendTo('#upload-passport-1');
    });
    jQuery(name_fields).each(function() {
        jQuery(surname_input).appendTo('#surname-group-1');
    });

    jQuery('#clone').click(function(e) {
        e.preventDefault();
        clone_dependant();
    });

    function clone_dependant() {
        var oldId = g_counter;
        g_counter++;
        currentdep ='dependant-'+g_counter;
        var $clonedDiv = jQuery('#dependant-1').clone(false).attr('id', currentdep);
        var id_up_newDiv = 'upload-id-'+ g_counter;
        var passport_up_newDiv = 'upload-passport-'+ g_counter;
        var surname_newDiv = 'surname-group-'+ g_counter;
        // Find div's inside the cloned object and set a new id's
        $clonedDiv.find('#upload-id-1').attr('id',"upload-id-" + g_counter );
        $clonedDiv.find('#upload-passport-1').attr('id',"upload-passport-" + g_counter );
        $clonedDiv.find('#surname-group-1').attr('id',"surname-group-" + g_counter );
        $clonedDiv.find('#dep_num').html(g_counter);
        // You don't need to Loop thru the inputs to set the value
        $clonedDiv.find('input[type="file"]').val('');

        // Insert the cloned object 
        $clonedDiv.insertAfter("#dependant-" + oldId);
        upload_input_id.push(id_up_newDiv);
        upload_input_passport.push(passport_up_newDiv);
        surname_input_groups.push(surname_newDiv);
    }

var result = {};
var dependants;
var mainmember;
var dep_counter = 0;
function getValues(){   
    result['dependants'] = [];
    jQuery('div[class*="dependant"]').each(function(k, v){
        dep_counter++
        dependants = {};
        dependants['surname'] = jQuery(v).find('.surname').val();
        dependants['id_upload'] = jQuery(v).find('.id_up').val();
        dependants['passport_upload'] = jQuery(v).find('.passport_up').val();
        result['dependants'].push(dependants);
    });

};
jQuery('#submit').click(function(){
    getValues();
    var jsonData = JSON.stringify(result);  
    (function() {
    var bar = jQuery('.bar');
    var percent = jQuery('.percent');
    var status = jQuery('#status');

    jQuery('form').ajaxForm({
        type: "POST",
        url: "mail.php",
        dataType: "json",
        //iframe: true,
        data: {parameters: jsonData},
        beforeSend: function() {
            status.empty();
            var percentVal = '0%';
            bar.css("width", percentVal)
            percent.html(percentVal);
        },
        uploadProgress: function(event, position, total, percentComplete) {
            var percentVal = percentComplete + '%';
            bar.css("width", percentVal)
            percent.html(percentVal);
        },
        complete: function(xhr) {
            status.html(xhr.responseText);
        }
    }); 

    })();   
});
});

和HTML：

<form enctype="multipart/form-data">
    <div class="dependant-1" id="dependant-1">
        <div class="title">dependant <span id="dep_num">1</span>:</div>
        <div class="block_wrap left border_right">
                <div class="block">'surname'<div id="surname-group-1" class="right"></div></div>
        </div>
        <div class="block_wrap left border_right no_b">
             <div class="block">dep_passport<div id="upload-id-1" class="right"></div>
        </div>
       </div>

       <div class="block_wrap right no_b">
       <div class="block">dep_id<div id="upload-passport-1" class="right"></div>
       </div>
            </div>
    </div>
    <button id="submit">sub</button>
</form>
<button id="clone">duplicate</button>

<div class="progress">
    <div class="bar"></div >
    <div class="percent">0%</div >
</div>

<div id="status"></div>

最后PHP用来发送它：

<?php /*?><?php
$newdirectory = "tmp";
$count = 0;
foreach ($_FILES['myfile']['name'] as $filename)
{
    $temp = $_FILES['myfile']['tmp_name'][$count];
    move_uploaded_file($temp, $newdirectory . '/' . $filename);
    $count++;
}
print_r($_FILES);
?><?php */?>
<?
    function printMember($member) {
        foreach($member as $key=>$value) {
            //Fill the aux string first
            $str.= "$key : $value <br />";
        }
        //string that will be added to $msg variable inside the loop
        return $str;
    }

    $json = $_POST['parameters'];
    $json_string = stripslashes($json);
    $data = json_decode($json_string, true);
    $depCount = count($data["dependants"]);

    $msg .= "<h2>Main member data:</h2>";
    $msg .= printMember($data["mainmember"]);
    $msg .= "<h2>There are $depCount Dependants</h2>";

    foreach ($data["dependants"] as $index => $dependant) {
       $msg .= "<h2>Dependant $index</h2>";
       $msg .= printMember($dependant);
    }

    $strTo = "chante@jamfactory.co.za";
    $strSubject = "Image Testing";
    $strMessage = nl2br($msg);

    //*** Uniqid Session ***//
    $strSid = md5(uniqid(time()));

    $strHeader = "";
    $strHeader .= "From: Dawid<test@testme.co.za>\nReply-To:test@testme.co.za";

    $strHeader .= "MIME-Version: 1.0\n";
    $strHeader .= "Content-Type: multipart/mixed; boundary=\"".$strSid."\"\n\n";
    $strHeader .= "This is a multi-part message in MIME format.\n";

    $strHeader .= "--".$strSid."\n";
    $strHeader .= "Content-type: text/html; charset=utf-8\n";
    $strHeader .= "Content-Transfer-Encoding: 7bit\n\n";
    $strHeader .= $strMessage."\n\n";

    //*** Attachment ***//
    $count = 0;
    foreach($_FILES['myfile']['name'] as $filename)
    {
        $temp = $_FILES['myfile']['tmp_name'][$count];
        $strFilesName = $filename;
        $strContent = chunk_split(base64_encode(file_get_contents($temp))); 
        $strHeader .= "--".$strSid."\n";
        $strHeader .= "Content-Type: application/octet-stream; name=\"".$strFilesName."\"\n"; 
        $strHeader .= "Content-Transfer-Encoding: base64\n";
        $strHeader .= "Content-Disposition: attachment; filename=\"".$strFilesName."\"\n\n";
        $strHeader .= $strContent."\n\n";
        $count++;
    }


    $flgSend = @mail($strTo,$strSubject,null,$strHeader);  // @ = No Show Error //

    if($flgSend)
    {
        echo "Mail send completed.";
    }
    else
    {
        echo "Cannot send mail.";
    }
?>

任何帮助都非常感激：）.. ..

Answer 1

jQuery .clone()方法的行为在jQuery（1.6.4+）中发生了变化，因此较旧的IE版本会出现问题。

在1.6.4中，jQuery改变了他们的内部行为，使用了旧的IE版本所遇到的JavaScript .cloneNode()方法。

对于IE7及以下版本，这个“黑客”似乎解决了这个问题。 http://jsfiddle.net/GZffK/3/

关键部分是使用旧的jQuery方式...当遇到IE7时使用.outerHTML属性。

    if($.browser.msie && (parseInt($.browser.version) < 8)){
        /*
            Dirty ugly hack to overcome bugs in IE with .cloneNode() method
            that is now used in jQuery 1.6.4+
        */
        var copiedDOMStr = $('#orig_test_0').get(0).outerHTML;    
        var copiedDOM = $(copiedDOMStr);    
    } else {
        var copiedDOM = $('#orig_test_0').clone();
    }

Answer 2

解决了这个问题...

就像向提交函数添加method="post" action="http://globalgeorgia.co.za/modules/mod_appform/js/mail.php"然后再添加type="submit"一样简单，它在IE 7和IE 8中完美运行。

感谢eveyone的帮助...

Jquery表示没有提交到IE7和IE8

2 个答案: